拖拖看小游戏

拖拖看小游戏

ios

project

本项目使用了 storyboard 和 xib

需求整理

---

•  一个滑动条

•  生成随机的目标数字

•  一个完成按钮

•  结果显示

•  积分累积 + 显示

•  轮数累积 + 显示

•  一个重新来过按钮

•  一个显示介绍的按钮

详细设计

---

1.  横屏显示，禁止竖屏

2.  页面布局：

   1. 屏幕最上方放置一文本控件，显示提示的话：拖动滑动条吧，让靶心尽可能接近目标；

   2. 屏幕中央显示滑块控件；

   3. 屏幕底部显示重新来过按钮控件、分数文本控件、轮数文本控件、介绍按钮控件；

3.  一进入页面，游戏开始：生成随机整数（( 0，100 ]）

4.  点击“猜猜看”按钮，将按钮点击时滑块的值与随机数进行对比，并根据算法^[1]得到成绩

5.  弹出对话框，显示成绩。对话框中有“接着玩”和“不玩了”按钮。点击“接着玩”按钮，对话框消失，滑块恢复初始值，本次积分累积到分数，轮数加1；点击“不玩了”按钮，对话框消失，本次积分累积到到分数，轮数加1

6.  点击显示介绍的按钮，弹出介绍页面

代码实现

---

1.  横屏显示，禁止竖屏

   1.  在 Xcode 中点击项目名称，会打开默认界面（General），在 Deployment Info 中，把 Device Orientation 属性的值：Portrait 前的复选框取消选中

   2.  打开 main.storyboard，在中间界面的顶部选中 View Controller，然后在右边的面板选择 Attributes Inspector 面板。在该面板中，设置 Orientation 属性为 Landscape。这时，你会看到中间界面的虚拟手机屏幕已经由竖向变为横向了

2.  设置界面

   1.  拖动 UILabel 控件，把它摆放到界面的顶部。双击这个控件，输入文字：拖动滑动条吧，让靶心尽可能接近目标

   2.  拖动 UISlider 控件，把它摆放在上一个控件的下方、屏幕中心的位置

   3.  拖动 UIButton 控件，把它摆放到上一个控件的下方，输入文字：猜猜看

   4.  分别拖动 UIButton、UILabel 控件（两个 UIButton ，一个是 Info Light 类型；四个 UILabel 控件，分别用于显示分数和回合数），放置于屏幕底部，并为控件设置文本

3.  生成 (0, 100] 的随机整数

4.  为 UISlider 设置值改变事件，为猜猜看按钮、重新来过按钮设置点击事件

部分重点代码

---

• ViewController.m

1. #import "ViewController.h" 

   ---

2. #import "AboutViewController.h" 

   ---

3.  

   ---

4. @interface ViewController () 

   ---

5.  

   ---

6. @property(nonatomic)int curVal; // 滑块当前的值 

   ---

7. @property(nonatomic)int targetVal; // 目标值（随机生成的数） 

   ---

8. @property(nonatomic)int score; // 得分 

   ---

9. @property(nonatomic)int count; // 回合数 

   ---

10.  

    ---

11. @property (weak, nonatomic) IBOutlet UISlider *slider; 

    ---

12. // 分数显示文本 

    ---

13. @property (weak, nonatomic) IBOutlet UILabel *scoreLabel; 

    ---

14. // 回合数显示文本 

    ---

15. @property (weak, nonatomic) IBOutlet UILabel *countLabel; 

    ---

16.  

    ---

17. @end 

    ---

18.  

    ---

19. @implementation ViewController 

    ---

20.  

    ---

21. // 生成新的随机数，将滑块的值设置为50，并设置得分、回合数文本的显示值 

    ---

22. - (void)startNewRound { 

    ---

23. _targetVal = 1 + arc4random() % 100; 

    ---

24. _curVal = 50; 

    ---

25. _slider.value = _curVal; 

    ---

26. _scoreLabel.text = [NSString stringWithFormat:@"%d", _score]; 

    ---

27. _countLabel.text = [NSString stringWithFormat:@"%d", _count]; 

    ---

28. } 

    ---

29.  

    ---

30. - (void)viewDidLoad { 

    ---

31. [super viewDidLoad]; 

    ---

32. // Do any additional setup after loading the view, typically from a nib. 

    ---

33. [self startNewRound]; 

    ---

34. } 

    ---

35.  

    ---

36. // 点击猜猜看按钮触发的事件 

    ---

37. - (IBAction)showAlert:(id)sender { 

    ---

38. int diff = abs(_curVal - _targetVal); 

    ---

39. int points = 100 - diff; 

    ---

40. NSString *title = nil; 

    ---

41.  

    ---

42. if (diff == 0) { 

    ---

43. title = @"土豪你太牛B了！"; 

    ---

44. points += 100; 

    ---

45. } else if (diff < 5) { 

    ---

46. title = @"土豪你太棒了，差一点！"; 

    ---

47. if (diff == 1) { 

    ---

48. points += 50; 

    ---

49. } 

    ---

50. } else if (diff < 10) { 

    ---

51. title = @"好吧，勉强算个土豪！"; 

    ---

52. } else { 

    ---

53. title = @"不是土豪少来装！"; 

    ---

54. } 

    ---

55. _score += points; 

    ---

56. _count++; 

    ---

57.  

    ---

58. NSString *msg = [NSString stringWithFormat:@"恭喜高富帅，你的得分是：%d", points]; 

    ---

59. UIAlertController *alertCtr = [UIAlertController alertControllerWithTitle:title message:msg preferredStyle:UIAlertControllerStyleAlert]; 

    ---

60. UIAlertAction *alertAction = [UIAlertAction actionWithTitle:@"朕已知晓，爱卿辛苦了" style:UIAlertActionStyleDefault handler: ^(UIAlertAction *action){ 

    ---

61. [self startNewRound]; 

    ---

62. }]; 

    ---

63. [alertCtr addAction:alertAction]; 

    ---

64. [self presentViewController:alertCtr animated:YES completion:nil]; 

    ---

65.  

    ---

66. } 

    ---

67.  

    ---

68. // 滑块值改变的事件 

    ---

69. - (IBAction)slideMove:(id)sender { 

    ---

70. UISlider *slider = (UISlider *)sender; 

    ---

71. _curVal = (int)lroundf(slider.value); 

    ---

72. } 

    ---

73.  

    ---

74. // 重新来过按钮点击事件 

    ---

75. - (IBAction)redo:(id)sender { 

    ---

76. _targetVal = 1 + arc4random() % 100; 

    ---

77. _curVal = 50; 

    ---

78. _score = 0; 

    ---

79. _count = 0; 

    ---

80. _slider.value = _curVal; 

    ---

81. _scoreLabel.text = [NSString stringWithFormat:@"%d", _score]; 

    ---

82. _countLabel.text = [NSString stringWithFormat:@"%d", _count]; 

    ---

83. } 

    ---

84.  

    ---

85. // 显示信息事件 

    ---

86. - (IBAction)showInfo:(id)sender { 

    ---

87. AboutViewController *controller = [[AboutViewController alloc] initWithNibName:@"AboutViewController" bundle:nil]; 

    ---

88. controller.modalPresentationStyle = UIModalTransitionStyleFlipHorizontal; 

    ---

89. [self presentViewController:controller animated:YES completion:nil]; 

    ---

90. } 

    ---

91. @end 

    ---

• AboutViewController.m

1. #import "AboutViewController.h"

   ---

2. ---

3. @interface AboutViewController ()

   ---

4. ---

5. @end

   ---

6. ---

7. @implementation AboutViewController

   ---

8. ---

9. - (void)viewDidLoad { 

   ---

10. [super viewDidLoad]; 

    ---

11. // Do any additional setup after loading the view from its nib.

    ---

12. } 

    ---

13. ---

14. - (void)didReceiveMemoryWarning { 

    ---

15. [super didReceiveMemoryWarning]; 

    ---

16. // Dispose of any resources that can be recreated.

    ---

17. } 

    ---

18. ---

19. - (IBAction)close:(id)sender { 

    ---

20. [self.presentingViewController dismissViewControllerAnimated:YES completion:nil]; 

    ---

21. } 

    ---

22. ---

23. @end
    
    

项目下载地址：点我下载

结束语

---

  技术的道路，漫漫其修远兮。学习一门新的技术，总是伴随着各种并发症。但只要熬过前期，并坚持在中期，相信，后期一定是辉煌的。

---

1. 使用滑块的值减去随机数，取结果的绝对值，绝对值加1就是最终结果。 ↩