你好,歡迎來到IOS教程網

 Ios教程網 >> IOS編程開發 >> IOS開發綜合 >> iOS7 故事版創建tanbar

iOS7 故事版創建tanbar

編輯:IOS開發綜合

在ios7中,方法setFinishedSelectedImage:withFinishedUnselectedImage: 已經被棄用,所以如果直接設置tabBarItem的selectImage和image時會出現不能顯示圖片的問題,效果可能如圖:

\

這個跟自己先要的圖片是明顯不一樣的,自己的圖片如圖:

\

另一個選中狀態是白色的就不截圖了,從上面已經可以看出來不一樣了,下面來說下具體怎麼寫成自己想要的效果,效果如圖:

\

怎麼創建 就不說了,tabbarViewController大家都會創建,下面來說詳細的設置

UITabBar *tabBar = self.tabBar;
    
    UITabBarItem *tabBarItem1 = [tabBar.items objectAtIndex:0];
    UITabBarItem *tabBarItem2 = [tabBar.items objectAtIndex:1];
    UITabBarItem *tabBarItem3 = [tabBar.items objectAtIndex:2];
    UITabBarItem *tabBarItem4 = [tabBar.items objectAtIndex:3];
    UITabBarItem *tabBarItem5 = [tabBar.items objectAtIndex:4];

創建5個UITabBarItem,然後就開始設置Item的圖片了
UIImage *tabBarItem1Image = [UIImage imageNamed:@"11"];
    UIImage *imgS1Image =[UIImage imageNamed:@"11s"];
    tabBarItem1.selectedImage = [tabBarItem1Image imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
    tabBarItem1.image = [imgS1Image imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
    
    UIImage *tabBarItem2Image = [UIImage imageNamed:@"12"];
    UIImage *imgS2Image =[UIImage imageNamed:@"12s"];
    tabBarItem2.selectedImage = [tabBarItem2Image imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
    tabBarItem2.image = [imgS2Image imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
    
    UIImage *tabBarItem3Image = [UIImage imageNamed:@"13"];
    UIImage *imgS3Image =[UIImage imageNamed:@"13s"];
    tabBarItem3.selectedImage = [tabBarItem3Image imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
    tabBarItem3.image = [imgS3Image imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
    
    UIImage *tabBarItem4Image = [UIImage imageNamed:@"14"];
    UIImage *imgS4Image =[UIImage imageNamed:@"14s"];
    tabBarItem4.selectedImage = [tabBarItem4Image imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
    tabBarItem4.image = [imgS4Image imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
    
    UIImage *tabBarItem5Image = [UIImage imageNamed:@"15"];
    UIImage *imgS5Image =[UIImage imageNamed:@"15s"];
    tabBarItem5.selectedImage = [tabBarItem5Image imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
    tabBarItem5.image = [imgS5Image imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];

上面的設置的方法就是iOS7以後用的,著色(Tint Color)是iOS7界面中的一個重大改變,你可以設置一個UIImage在渲染時是否使用當前視圖的Tint Color。UIImage新增了一個只讀屬性:renderingMode,對應的還有一個新增方法:imageWithRenderingMode:,它使用UIImageRenderingMode枚舉值來設置圖片的renderingMode屬性。該枚舉中包含下列值:

UIImageRenderingModeAutomatic// 根據圖片的使用環境和所處的繪圖上下文自動調整渲染模式。

UIImageRenderingModeAlwaysOriginal// 始終繪制圖片原始狀態,不使用Tint Color。

UIImageRenderingModeAlwaysTemplate,// 始終根據Tint Color繪制圖片,忽略圖片的顏色信息。


接下來修改item的文字,代碼如下

[[UITabBarItem appearance] setTitleTextAttributes:@{NSFontAttributeName : [UIFont fontWithName:@"HelveticaNeue-Bold" size:10.0f],
                                                        NSForegroundColorAttributeName : [UIColor orangeColor]
                                                        } forState:UIControlStateNormal];//未選中
    [[UITabBarItem appearance] setTitleTextAttributes:@{NSFontAttributeName : [UIFont fontWithName:@"HelveticaNeue-Bold" size:10.0f],
                                                        NSForegroundColorAttributeName : [UIColor greenColor]
                                                        } forState:UIControlStateSelected];//選中


設置背景圖片及選中item時的圖片如下

//設置選中item後,顯示在此item下面的圖?
    tabBar.selectionIndicatorImage = [UIImage imageNamed:@"select_bg"];
    
//設置tabBar的背景圖?
    self.tabBar.backgroundImage = [UIImage imageNamed:@"show_bg"];


大功告成!

  1. 上一頁:
  2. 下一頁:
蘋果刷機越獄教程| IOS教程問題解答| IOS技巧綜合| IOS7技巧| IOS8教程
Copyright © Ios教程網 All Rights Reserved