IOS componentization – Basics

Note related Git repository

  • DYDemoSpecs

  • DYDemoTools

  • DYDemo666

  • DYDemoLogin666

The previous article focused on how to componentize through CocoaPod. Here we are going to componentize the Demo: create a component for the login module: DYDemoLogin666. The logon logic, interface, and user information are all in this component. Facilitate the development of other functional modules in the future.

1. Create DYDemoLogin666 in the same way you created DYDemoTools



2, The Example project PodFile

use_frameworks!

platform :ios, '10.0'

source 'https://github.com/CocoaPods/Specs.git'  # the official library
source 'http://github.com/liyunxin/DYDemoSpecs.git' # private library

target 'DYDemoLogin666' do
  pod 'DYDemoTools'
  pod 'DYDemoLogin666', :path => '.. / '
end
Copy the code

Podspec files

Pod::Spec.new do |s|
  s.name             = 'DYDemoLogin666'
  s.version          = '0.0.1'
  s.summary          = 'A short description of DYDemoLogin666.'

  s.description      = <<-DESC
  TODO: Add long description of the pod here.
  DESC

  s.homepage         = 'https://github.com/liyunxin/DYDemoLogin666'
  s.license          = { :type= >'MIT', :file => 'LICENSE' }
  s.author           = { 'liyunxin'= >'[email protected]' }
  s.source           = { :git => 'https://github.com/liyunxin/DYDemoLogin666.git', :tag => s.version.to_s }

  s.platform   = :ios, "10.0"
  s.frameworks = 'UIKit'

  s.dependency "DYDemoTools"
  
  s.subspec '0_Base' do |sb|
    sb.source_files = "DYDemoLogin666/Base/**/*.{h,m}"
    sb.resource_bundles = {
      'DYDemoLogin666'= > ['DYDemoLogin666/Base/*.xcassets']
    }
  end
  
  s.subspec '1_Tools' do |st|
    st.source_files = "DYDemoLogin666/Tools/**/*.{h,m}"
  end
  
  s.subspec '2_Data' do |st|
    st.source_files = "DYDemoLogin666/Data/**/*.{h,m}"
  end
  
  s.subspec '3_Controller' do |sv|
    sv.source_files = "DYDemoLogin666/Controller/**/*.{h,m}"
  end
  
end
Copy the code

DYDemoLogin666 component

Specific implementation please check:
DYDemoLogin666

4.1, DYDemoLoginHeader

This is a header file used internally by the component, importing dependent libraries, global usage categories, and so on. It only appears in the component’s.m file, never exposed to the.h file. 

#ifndef DYDemoLoginHeader_h
#define DYDemoLoginHeader_h

#import "DYDemoTools/DYDemoToolsHeader.h"
#import "DYDemoTools+DLCategory.h"

#endif /* DYDemoLoginHeader_h */Copy the code

4.2, DYDemoLoginData

This is a singleton that holds user data. The advantage of singletons is that they can be used in other components.

4.3, DYDemoLogin

This is the external entry point of the component. Other projects using DYDemoLogin666 allow only DYDemoLogin as the entry point.
This is done to reduce coupling. It’s not unique. It can be done hereCasa Taloyum’s component solution:
CTMediator

5. Import components into the main project

Module components differ from base components in that module components do not need to be versioned. So the alternative import option is to import directly without committing to a private Repo.

5.1 Modify the Podfile of DYDemo666 as follows, and make pod update to the project

use_frameworks!

platform :ios, '10.0'

source 'https://github.com/CocoaPods/Specs.git'  # the official library
source 'http://github.com/liyunxin/DYDemoSpecs.git' # private library

target 'DYDemo666' do
  pod 'DYDemoTools'
  pod 'DYDemoLogin666', :git => 'https://github.com/liyunxin/DYDemoLogin666.git' 
endCopy the code

5.2. Add the PCH file and import components

#ifndef DYDemo666_pch
#define DYDemo666_pch

#import "DYDemoTools/DYDemoToolsHeader.h"
#import "DYDemoLogin666/DYDemoLogin.h"

#endif /* DYDemo666_pch */
Copy the code

5.3. Then you can use the functions of DYDemo666 component in the main project, and the effects are as follows:



6. Specific application of CTMediator

Please check the principle of CTMediator
The original

6.1. Add CTMediator file in DYDemoTools and re-tag it to the Repo

6.2 Add the personal Information interface in DYDemoLogin666

6.3 Implement CTMediator related logical files

Added CTMediator classification: CTMediator+DYDemoLogin

This category name is optional

 

#import "DYDemoTools/CTMediator.h"

@interface CTMediator (DYDemoLogin)

- (UIViewController *)ingoVC;

@end
Copy the code

#import "CTMediator+DYDemoLogin.h"

@implementation CTMediator (DYDemoLogin)

- (UIViewController *)ingoVC {
    return [self performTarget:@"DYDemoLogin"
                        action:@"InfoVC"
                        params:@{}
             shouldCacheTarget:NO];
}

@endCopy the code

Add the Target_DYDemoLogin class:

The class name has a fixed format, as do the names of member methods

 

#import <Foundation/Foundation.h>

@interface Target_DYDemoLogin : NSObject

- (UIViewController *)Action_InfoVC:(NSDictionary *)param;
- (UIViewController *)Action_AboutVC:(NSDictionary *)param;

@end
Copy the code

#import "Target_DYDemoLogin.h"
#import "DYInfoController.h"

@implementation Target_DYDemoLogin

- (UIViewController *)Action_InfoVC:(NSDictionary *)param {
    return [[DYInfoController alloc] init];
}

- (UIViewController *)Action_AboutVC:(NSDictionary *)param {
    UIViewController *vc = [[UIViewController alloc] init];
    vc.view.backgroundColor = [UIColor whiteColor];
    vc.navigationItem.title = [NSString stringWithFormat:@"About us -%@", param[@"name"]].return vc;
}

@end
Copy the code

7. Through CTMediator in the main project

Configure a Scheme: dydemo666 for the main project before using it 

UIViewController *vc1 = [[CTMediator sharedInstance] ingoVC]; [self.navigationController pushViewController:vc1 animated:YES]; NSURL *url2 = [NSURL URLWithString:@"dydemo666://DYDemoLogin/InfoVC]; UIViewController *vc2 = [[CTMediator sharedInstance] performActionWithUrl:url2 completion:nil]; [self.navigationController pushViewController:vc2 animated:YES]; NSURL *url3 = [NSURL URLWithString:@"dydemo666://DYDemoLogin/AboutVC? name=heiheihei"];
UIViewController *vc3 = [[CTMediator sharedInstance] performActionWithUrl:url3 completion:nil];
[self.navigationController pushViewController:vc3 animated:YES];Copy the code

For details, see DYDemo666