x-code製作坑爹版五音十圖

標籤：style   blog   http   color   strong   os   

這一個多星期以來只學會了建立按鈕，設定背景，添加動畫三個操作，涉及演算法跟一些函數調用的代碼都不是很懂，然後勉強製作出了下面這個坑爹版“五音十圖”，實現的功能相當寒酸：1、單擊【practice】出來動畫 。2、單擊【back】跳到第二個頁面 3、點【pronounce】發出聲音 4、清除當前顯示的字 5，在第二個頁面按某個字可以跳回首頁面。。。。。PS:看同學們玩UI控制都挺上手的，而自己照著老師的代碼看啊敲啊半天也搞不懂怎麼回事，每天珊哥布置的任務不能如期完成，心裡也有點急，沒辦法，既然是只笨鳥，就按笨鳥的方法來吧，照著例子多敲一次，懂一點是一點

介面如下所示：

                            

製作步驟：

1，建立一個空工程，在空工程裡建立ViewController和SecondViewController兩個類，然後把所需的圖片素材全拖到image.xcassets裡面，音樂素材拖到左側列表

2，開啟Main.storyboard,建立導航視窗

3，給viewcontrol建立背景

封裝一個creatbg函數，併到- (void)viewDidLoad裡實現，實現方法 [self creatbg];

-(void)creatbg{       //設定背景圖片       UIImageView *BgView =[[UIImageView alloc]initWithFrame:CGRectMake(0, 44, 320, 418)];//中間背景圖片    BgView.image = [UIImage imageNamed:@"BgView"];    [self.view addSubview:BgView];    UIImageView *title = [[UIImageView alloc]initWithFrame:CGRectMake(0, 0, 320, 49)];//頂欄圖片    title.image = [UIImage imageNamed:@"titleView"];    [self.view addSubview:title];    UIImageView *bottomBg = [[UIImageView alloc]initWithFrame:CGRectMake(0, self.view.frame.size.height - 49, 320, 49)];//底欄圖片    bottomBg.image = [UIImage imageNamed:@"bottomBg"];    [self.view addSubview:bottomBg];}

creatbg

4,建立按鈕

封裝一個createbutton函數，併到- (void)viewDidLoad裡實現，實現方法 [self createbutton];

 1 -(void)createButton{ 2      3     UIButton *backBtn = [UIButton buttonWithType:UIButtonTypeCustom];//返回鍵 4     backBtn.frame = CGRectMake(10, 7, 70, 35); 5     [backBtn setImage:[UIImage imageNamed:@"backBtn"]forState:UIControlStateNormal];//[XX setImage:[UIimage:@"圖片名"]forState 寫錯很多次 6     [backBtn addTarget:self action:@selector(didClick:)forControlEvents:UIControlEventTouchUpInside];//定義返回鍵的響應，@selector（didclick:)老丟冒號 7     [self.view addSubview:backBtn]; 8      9     10     UIButton *clearBtn = [UIButton buttonWithType:UIButtonTypeCustom];// 清除鍵11     clearBtn.frame = CGRectMake(240, 7, 70, 35);12     [clearBtn setImage:[UIImage imageNamed:@"clearBtn"] forState:UIControlStateNormal];13     [clearBtn addTarget:self action:@selector(didClear:) forControlEvents:UIControlEventTouchUpInside];14     [self.view addSubview:clearBtn];15     16     UIButton *wordBtn = [UIButton buttonWithType:UIButtonTypeCustom];//練習按鈕17     wordBtn.frame = CGRectMake(240, self.view.frame.size.height - 49, 67, 52);18     [wordBtn setImage:[UIImage imageNamed:@"practiceBtn_01"] forState:UIControlStateNormal];19     [wordBtn setImage:[UIImage imageNamed:@"practiceBtn_02"] forState:UIControlStateHighlighted];20     [wordBtn addTarget:self action:@selector(didpractice:) forControlEvents:UIControlEventTouchUpInside];21     [self.view addSubview:wordBtn];22     23     24     UIButton *pronounceBtn = [UIButton buttonWithType:UIButtonTypeCustom];//發音按鈕25     pronounceBtn.frame = CGRectMake(10, self.view.frame.size.height - 49, 67, 52);26     [pronounceBtn setImage:[UIImage imageNamed:@"pronounceBtn_01"] forState:UIControlStateNormal];27     [pronounceBtn setImage:[UIImage imageNamed:@"pronounceBtn_02"] forState:UIControlStateHighlighted];//設定圖片高亮28     [pronounceBtn addTarget:self action:@selector(didVoice:) forControlEvents:UIControlEventTouchUpInside];29     [self.view addSubview:pronounceBtn];30 }

createButton

5，定義的按鈕需要一個相應的按鍵響應來實現其功能

 1 -(void)didClear:(UIButton *)sender{   //清除按鈕的響應 2      3      4     [animation removeFromSuperview];//這個代碼還不是很熟悉 5  6 } 7  8 -(void)didVoice:(UIButton *)sender   //發聲音的響應 9 {10 11     AudioServicesPlaySystemSound(soundID);12     NSLog(@"OMG，不會做。。。");13 14 }15 -(void)didClick:(UIButton*)sender         //去到另一個頁面16 {17     SecondViewController *secondCtr = [[SecondViewController alloc] init];18     [self.navigationController pushViewController:secondCtr animated:YES];19 }20 21 22 -(void)didpractice:(UIButton *)sender{23     animation.image = [UIImage imageNamed:@"ne0001"];//執行動畫24     animation.animationDuration = 2;25     animation.animationRepeatCount = 1;26     [self.view addSubview:animation];27     [animation startAnimating];28 29 }

6，標頭檔加入#import <AudioToolbox/AudioToolbox.h>   //需要調用聲音需要添加這個標頭檔

7，添加動畫

-(void)creatanimation{    animation = [[UIImageView alloc]initWithFrame:CGRectMake(50, 95, 227, 227)];//設定動畫    NSMutableArray *array = [[NSMutableArray alloc]init];//初始化動畫數組    for (int i=1; i<18; i++) {        NSString *name = [NSString stringWithFormat:@"ne%04d",i];        NSLog(@"%@",name);        UIImage *image = [UIImage imageNamed:name];        [array addObject:image];    }    animation.animationImages = array;    [self.view addSubview:animation]  //一定要記得這句話，不然動畫不會顯示}

8，在viewdidload添加執行代碼

- (void)viewDidLoad {    [super viewDidLoad];    self.navigationController.navigationBarHidden= YES;//隱藏導航條    [self creatbg];//調用creatbg函數    [self createButton];//調用createbutton    [self creatanimation];//調用creatanimation函數    NSURL *url = [[NSBundle mainBundle] URLForResource:@"003_e" withExtension:@"mp3"];//添加聲音    AudioServicesCreateSystemSoundID((__bridge CFURLRef)(url), &soundID);//不知道什麼意思，記住就行

9,在secondviewcontrol添加背景以及按鈕的封裝函數，並在didload中調用

- (void)creatBGview{    UIImageView *bgimage1 = [[UIImageView alloc]initWithFrame:CGRectMake(0, 0, 320, 480)];    bgimage1.image = [UIImage imageNamed:@"bg_01"];    [self.view addSubview:bgimage1];    UIImageView *bgimage2 = [[UIImageView alloc]initWithFrame:CGRectMake(0, 0, 320, 480)];    bgimage2.image = [UIImage imageNamed:@"bg_01_01"];    [bgimage1 addSubview:bgimage2];}- (void)creatbutton{    UIButton *but = [UIButton buttonWithType:UIButtonTypeSystem];    but.frame = CGRectMake(260, 35, 50, 40);    [but setTitle:@"" forState:UIControlStateNormal];    [but addTarget:self action:@selector(didback:) forControlEvents:UIControlEventTouchUpInside];    [self.view addSubview:but];}

secondviewcontrol

 

- (void)viewDidLoad{    [super viewDidLoad];    [self creatBGview];    [self creatbutton];

didload

 

如果明天能搞懂一點點頁面導航控制，再來更新。。如果搞不懂，，部落格也沒必要寫下去了，寫部落格的時候也沒讓自己多理解多少東西