iOS App主题皮肤切换功能简介和具体实现详解 附有源码

分享一个朋友的人工智能教程。比较通俗易懂,风趣幽默,感兴趣的朋友可以去看看。

 

0.换肤的应用场景

  • 一般情况下某些App在节假日(春节、中秋、国庆等)切换主题,显得更适合当下的气氛;
  • 切换白天或夜晚模式;
  • 用户不喜欢App默认的主题更换为其它主题;

 

1. 主题皮肤功能切换介绍

主题切换就是根据用户设置不同的主题,来动态改变用户的界面,一般是换图片或者背景图片、文字这两种情况:

  • 图片: 通常会改变navigationBar背景图片、tabBar背景图片、tabBar中的按钮的图片和选中的背景图片、
  • 文字:navigationItem.title 标题的字体颜色或者其它部分的文字颜色、

 

《GitHub源码地址》

2.项目目录结构及实现效果截图

该示例分为三个模块:首页,消息,我

Skins:是一个物理文件夹,用于存放各个主题图片,如blue物理文件夹、pink物理文件

theme.plist:用于配置所有主题名字及对应的路径

 

这里默认有三个主题,Image虚拟文件作为默认主题、blue物理文件夹:蓝色主题、pink物理文件:粉色主题, 因为一个主题一般是一个物理文件夹包含各种主题图片,可能还有一个.plist文件用于配置该主题的其他配置如字体颜色RGB,为了减少App的大小,可以为每个主题提供一个下载主题的按钮去下载主题,以后就可以使用了

 

 

 

 

 

3. 具体实现步骤

1.将image文件夹(group)和 Skins拖入到项目工程中的资源文件夹(物理文件)中

2.创建BaseViewController:用户监听用户更换主题的通知和加载主题对应的图片

3.配置theme.plist:配置所有的主题及对应的主题文件夹对应的路径

4.事项项目所需的基本框架供能,并实现主题的tableView功能

5.创建主题管理器:ThemeManager

6.自定义ThemeTabBarItem 控件

7.创建UI工厂: UIFactory

8. 实现tableView中的didSelected事件完成主题切换

9.记录用户选择的主题,以便用户下次启动时是上次设置的主题

 

 

1.创建BaseViewController

 

#import <UIKit/UIKit.h>

@interface BaseViewController : UIViewController


- (void) reloadThemeImage;
@end
#import "BaseViewController.h"

#import "ThemeManager.h"
#import "NotificationMacro.h"

@interface BaseViewController ()

@end

@implementation BaseViewController
- (id) init {
    if (self == [super init]) {
        [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(themeChangedNotfication:) name:kThemeChangedNotification object:nil];
    }
    
    [self reloadThemeImage];
    return self;
}

- (void)viewDidLoad {
    [super viewDidLoad];
    [self reloadThemeImage];
}


- (void) themeChangedNotfication:(NSNotification *)notification {
    [self reloadThemeImage];
}

- (void) reloadThemeImage {
    ThemeManager *themeManager = [ThemeManager sharedThemeManager];
    
    UIImage *navigationBackgroundImage = [themeManager themeImageWithName:@"navigationbar_background.png"];
    [self.navigationController.navigationBar setBackgroundImage:navigationBackgroundImage forBarMetrics:UIBarMetricsDefault];
    
    UIImage *tabBarBackgroundImage = [themeManager themeImageWithName:@"tabbar_background.png"];
    [self.tabBarController.tabBar setBackgroundImage:tabBarBackgroundImage];
}
@end

 

2. 实现AppDelegate

#import "AppDelegate.h"

#import "MainViewController.h"
#import "ThemeManager.h"
#import "NotificationMacro.h"

@interface AppDelegate ()

@end

@implementation AppDelegate


- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
    [self initUserDefaultConfig];
    
    MainViewController *rootViewController = [[MainViewController alloc] init];
    self.window.rootViewController = rootViewController;
    
    return YES;
}


- (void) initUserDefaultConfig {
    NSString *themeName = [[NSUserDefaults standardUserDefaults] objectForKey:kThemeNameKey];
    ThemeManager *themeManager = [ThemeManager sharedThemeManager];
    themeManager.themeName = themeName;
}
#import "MainViewController.h"

#import "HomeViewController.h"
#import "MessageViewController.h"
#import "MineViewController.h"

#import "UIFactory.h"


@interface MainViewController ()

@end

@implementation MainViewController

- (id) init {
    if (self = [super init]) {
        [self initTabBarUI];
    }
    
    return self;
}

- (void)viewDidLoad {
    [super viewDidLoad];
    
}

- (void) initTabBarUI {
    // 主页
    HomeViewController *homeViewController = [[HomeViewController alloc] init];
    UINavigationController * homeNavigationController = [[UINavigationController alloc] initWithRootViewController:homeViewController];
//    UITabBarItem *homeTabBarItem = [[UITabBarItem alloc] initWithTitle:@"主页" image:[UIImage imageNamed:@"tabbar_home"] selectedImage:[UIImage imageNamed:@"tabbar_home_selected"]];
    UITabBarItem *homeTabBarItem = [UIFactory createTabBarItemWithTitle:@"主页" imageName:@"tabbar_home" selectedImage:@"tabbar_home_selected"];
    homeNavigationController.tabBarItem = homeTabBarItem;
    
    // 消息(中心)
    MessageViewController *messageViewController = [[MessageViewController alloc] init];
    UINavigationController *messageNavigationController = [[UINavigationController alloc] initWithRootViewController:messageViewController];
//    UITabBarItem * messageTabBarItem = [[UITabBarItem alloc] initWithTitle:@"消息" image:[UIImage imageNamed:@"tabbar_message_center"] selectedImage:[UIImage imageNamed:@"tabbar_message_center_selected"]];
    UITabBarItem *messageTabBarItem = [UIFactory createTabBarItemWithTitle:@"消息" imageName:@"tabbar_message_center" selectedImage:@"tabbar_message_center_selected"];
    messageNavigationController.tabBarItem = messageTabBarItem;
    
    // 我
    MineViewController *mineViewController = [[MineViewController alloc] init];
    UINavigationController *mineNavigationController = [[UINavigationController alloc] initWithRootViewController:mineViewController];
//    UITabBarItem *mineTabBarItem = [[UITabBarItem alloc] initWithTitle:@"我" image:[UIImage imageNamed:@"tabbar_profile"] selectedImage:[UIImage imageNamed:@"tabbar_profile_selected"]];
    UITabBarItem *mineTabBarItem = [UIFactory createTabBarItemWithTitle:@"我" imageName:@"tabbar_profile" selectedImage:@"tabbar_profile_selected"];
    
    
    mineNavigationController.tabBarItem = mineTabBarItem;
    NSArray *viewControllers = @[homeNavigationController, messageNavigationController, mineNavigationController];
    self.viewControllers = viewControllers;
}


@end

 

3. 创建主题管理器 

#import <Foundation/Foundation.h>
#import <UIKit/UIKit.h>

@interface ThemeManager : NSObject

@property (nonatomic, copy) NSString *themeName;           // 主题名字
@property (nonatomic, retain) NSDictionary *themePlistDict;    // 主题属性列表字典

+ (ThemeManager *) sharedThemeManager;

- (UIImage *) themeImageWithName:(NSString *)imageName;
@end

 

#import <Foundation/Foundation.h>
#import <UIKit/UIKit.h>
@interface ThemeManager : NSObject

@property (nonatomic, copy) NSString *themeName;           // 主题名字
@property (nonatomic, retain) NSDictionary *themePlistDict;    // 主题属性列表字典

+ (ThemeManager *) sharedThemeManager;

- (UIImage *) themeImageWithName:(NSString *)imageName;
@end
#import "ThemeManager.h"
#import "NotificationMacro.h"
static ThemeManager *sharedThemeManager;

@implementation ThemeManager

- (id) init {
    if(self = [super init]) {
        NSString *themePath = [[NSBundle mainBundle] pathForResource:@"theme" ofType:@"plist"];
        self.themePlistDict = [NSDictionary dictionaryWithContentsOfFile:themePath];
        self.themeName = nil;
    }
    
    return self;
}

+ (ThemeManager *) sharedThemeManager {
    @synchronized(self) {
        if (nil == sharedThemeManager) {
            sharedThemeManager = [[ThemeManager alloc] init];
        }
    }
    
    return sharedThemeManager;
}

// Override 重写themeName的set方法
- (void) setThemeName:(NSString *)themeName {
    _themeName = themeName;
}

- (UIImage *) themeImageWithName:(NSString *)imageName {
    if (imageName == nil) {
        return nil;
    }
    
    NSString *themePath = [self themePath];
    NSString *themeImagePath = [themePath stringByAppendingPathComponent:imageName];
    UIImage *themeImage = [UIImage imageWithContentsOfFile:themeImagePath];
    
    return themeImage;
}

// 返回主题路径
- (NSString *)themePath {
    NSString *resourcePath = [[NSBundle mainBundle] resourcePath];
    if (self.themeName == nil || [self.themeName isEqualToString:@""]) {
        return resourcePath;
    }
    
    
    NSString *themeSubPath = [self.themePlistDict objectForKey:self.themeName];    // Skins/blue
    NSString *themeFilePath = [resourcePath stringByAppendingPathComponent:themeSubPath]; // .../Skins/blue
    
    return themeFilePath;
}
@end

 

4. 创建主题按钮 ThemeTabBarItem

 

#import <UIKit/UIKit.h>

@interface ThemeTabBarItem : UITabBarItem

@property (nonatomic, copy) NSString *imageName;
@property (nonatomic, copy) NSString *selectedImageName;


- (id) initWithTitle:(NSString *)title imageName:(NSString *)imageName selectedImage:(NSString *)selectedImageName;

@end

 

#import "ThemeTabBarItem.h"
#import "ThemeManager.h"
#import "NotificationMacro.h"

@implementation ThemeTabBarItem

// 初始化时注册观察者
- (id) init {
    if (self = [super init]) {
        [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(themeChangedNotification:) name:kThemeChangedNotification object:nil];
    }
    
    return self;
}

- (id) initWithTitle:(NSString *)title imageName:(NSString *)imageName selectedImage:(NSString *)selectedImageName {
    if (self = [self init]) {
        self.title = title;
        self.imageName = imageName;         // 此时会调用[self setImageName:imageName] ---> [self reloadThemeImage] --->[self setImage:image]
        self.selectedImageName = selectedImageName;// 此时会调用[self setSelectedImageName:selectedImageName];
    }
    
    return self;
}


#pragma mark -
#pragma mark - Override Setter
- (void) setImageName:(NSString *)imageName {
    if (_imageName != imageName) {
        _imageName = imageName;
    }
    
    [self reloadThemeImage];
}

- (void) setSelectedImageName:(NSString *)selectedImageName {
    if (_selectedImageName != selectedImageName) {
        _selectedImageName = selectedImageName;
    }
    
    [self reloadThemeImage];
}



// 主题改变之后重新加载图片
- (void)themeChangedNotification:(NSNotification *)notification {
    [self reloadThemeImage];
}

- (void)reloadThemeImage {
    ThemeManager * themeManager = [ThemeManager sharedThemeManager];
    
    if (self.imageName != nil) {
        UIImage * image = [themeManager themeImageWithName:self.imageName];
        [self setImage:image];
    }
    
    if (self.selectedImageName != nil) {
        UIImage * selectedImage = [themeManager themeImageWithName:self.selectedImageName];
        [self setSelectedImage:selectedImage];
    }
}


- (void) dealloc {
    [[NSNotificationCenter defaultCenter] removeObserver:self];
}

 

5. 创建UI工厂

#import <Foundation/Foundation.h>
#import <UIKit/UIKit.h>

@interface UIFactory : NSObject

+ (UITabBarItem *) createTabBarItemWithTitle:(NSString *)title imageName:(NSString *)imageName selectedImage:(NSString *)selectedImageName;


@end

 

#import <Foundation/Foundation.h>
#import <UIKit/UIKit.h>

@interface UIFactory : NSObject

+ (UITabBarItem *) createTabBarItemWithTitle:(NSString *)title imageName:(NSString *)imageName selectedImage:(NSString *)selectedImageName;


@end
#import "UIFactory.h"

#import "ThemeTabBarItem.h"
@implementation UIFactory

+ (UITabBarItem *) createTabBarItemWithTitle:(NSString *)title imageName:(NSString *)imageName selectedImage:(NSString *)selectedImageName {
    ThemeTabBarItem * themeTabBarItem = [[ThemeTabBarItem alloc] initWithTitle:title imageName:imageName selectedImage:selectedImageName];
    
    return themeTabBarItem;
}
@end


6. 实现选中单元格的事件

 

#import "BaseViewController.h"

@interface MineViewController : BaseViewController <UITableViewDelegate, UITableViewDataSource>


@property (weak, nonatomic) IBOutlet UITableView *tableView;

@property (nonatomic, retain) NSMutableArray * themeDataSource;
@end
#import "BaseViewController.h"

@interface MineViewController : BaseViewController <UITableViewDelegate, UITableViewDataSource>


@property (weak, nonatomic) IBOutlet UITableView *tableView;

@property (nonatomic, retain) NSMutableArray * themeDataSource;
@end
#import "MineViewController.h"

#import "ThemeManager.h"
#import "NotificationMacro.h"

@interface MineViewController ()

@end

@implementation MineViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    self.title = @"我";
    
    ThemeManager * themeManager = [ThemeManager sharedThemeManager];
    _themeDataSource = [NSMutableArray arrayWithArray:themeManager.themePlistDict.allKeys];
}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}



#pragma mark -
#pragma mark - UITableViewDelegate
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {

    return self.themeDataSource.count;
}

- (UITableViewCell *) tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    static NSString * Identifier = @"Cell";
    UITableViewCell * cell = [tableView dequeueReusableCellWithIdentifier:Identifier];
    if (cell == nil) {
        cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:Identifier];
    }
    
    NSString * text = self.themeDataSource[indexPath.row];
    cell.textLabel.text = text;
    
    ThemeManager * themeManager = [ThemeManager sharedThemeManager];
    NSString * currentTheme = themeManager.themeName;
    if (currentTheme == nil) {
        currentTheme = @"默认";
    }
    if ([currentTheme isEqualToString:text]) {
        cell.accessoryType = UITableViewCellAccessoryCheckmark;
    } else {
        cell.accessoryType = UITableViewCellAccessoryNone;
    }
    
    return cell;
}

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {
    
    ThemeManager * themeManager = [ThemeManager sharedThemeManager];
    NSString * themeName = self.themeDataSource[indexPath.row];
    
    if ([themeName isEqualToString:@"默认"]) {
        themeName = nil;
    }
    
    // 记录当前主题名字
    themeManager.themeName = themeName;
    [[NSNotificationCenter defaultCenter] postNotificationName:kThemeChangedNotification object:nil];
    
    
    // 主题持久化
    NSUserDefaults * userDefaults = [NSUserDefaults standardUserDefaults];
    [userDefaults setObject:themeName forKey:kThemeNameKey];
    [userDefaults synchronize];
    
    // 重新加载数据显示UITableViewCellAccessoryCheckmark 显示选中的对号 v
    [self.tableView reloadData];
}

 

分享一个朋友的人工智能教程。比较通俗易懂,风趣幽默,感兴趣的朋友可以去看看。

  • 3
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

风流 少年

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值