扩展iOS的功能

~  Component 与UI控件相关 ,即通过原生方法创建UI界面,返回给weex 使用

一. 新建 WXComponent 的子类

    在子类实现WXComponent 的生命周期方法

.h

#import "WXComponent.h"

@interface MyComponent : WXComponent

@end

.m

#import "WXDatePickerComponent.h"

//原生自定义的UI控件类
@interface WXDatePickerView : UIDatePicker @end @implementation WXDatePickerView @end
@interface WXDatePickerComponent()
@property (nonatomic, strong) WXDatePickerView *datePickerView;
@property (nonatomic, assign) BOOL changeEvent; @end
//component 的.m
@implementation WXDatePickerComponent
- (instancetype)initWithRef:(NSString *)ref type:(NSString *)type styles:(NSDictionary *)styles attributes:(NSDictionary *)attributes events:(NSArray *)events weexInstance:(WXSDKInstance *)weexInstance
{
if (self = [super initWithRef:ref type:type styles:styles attributes:attributes events:events weexInstance:weexInstance]) { }
return self;
}
//返回给weex,原生创建的UI控件
- (UIView *)loadView
{
return [[WXDatePickerView alloc] init];
} - (void)viewDidLoad
{
_datePickerView = (WXDatePickerView *)self.view;
_datePickerView.backgroundColor =[UIColor whiteColor];
[_datePickerView setLocale:[[NSLocale alloc]initWithLocaleIdentifier:@"zh_CN"]];
[_datePickerView setTimeZone:[NSTimeZone localTimeZone]];
[_datePickerView setDate:[NSDate date] animated:YES];
[_datePickerView setMaximumDate:[NSDate date]];
[_datePickerView setDatePickerMode:UIDatePickerModeDate];
[_datePickerView addTarget:self action:@selector(datePickerValueChanged:) forControlEvents:UIControlEventValueChanged]; }
- (void)datePickerValueChanged:(UIDatePicker *)datePicker{
if (_changeEvent) {
[self fireEvent:@"change" params:@{@"value":datePicker.date} domChanges:@{@"attrs": @{@"checked": datePicker.date}}];
}
}

二. 注册

*注意: 自定义的Component的需要在WeexSDK 初始化的时候 注册

[WXSDKEngine registerComponent:@"MyView" withClass:[MyViewComponent class]];

weex 自定义Component的更多相关文章

  1. Ionic2学习笔记(2):自定义Component

    作者:Grey 原文地址: http://www.cnblogs.com/greyzeng/p/5536298.html                     上一篇提到,Ionic2提供了很多Co ...

  2. weex 自定义Modul

    扩展iOS的功能 一. 新建 NSOjbect 子类, 并遵循协议<WXModuleProtocol> .h 代码 #import <Foundation/Foundation.h& ...

  3. #Weex与Android交互(一)

    用Weex开发Android程序 参考:开发HelloWorld程序(Weex开发) 1.创建Android工程 2.集成WeexSDK,参考[WEEX SDK 集成到 Android 工程](htt ...

  4. 第八章 交互技术,8.4 Weex 双11会场大规模应用的秒开实战和稳定性保障(作者:鬼道)

    8.4 Weex 双11会场大规模应用的秒开实战和稳定性保障 前言 Native 开发的诸多亮点中,流畅体验和系统调用是最多被提及的.流畅体验体现在页面滚动/动画的流畅性,背后是更好的内存管理和更接近 ...

  5. salesforce lightning零基础学习(四) 事件(component events)简单介绍

    lightning component基于事件驱动模型来处理用户界面的交互.这种事件驱动模型和js的事件驱动模型也很相似,可以简单的理解成四部分: 1.事件源:产生事件的地方,可以是页面中的输入框,按 ...

  6. 创建自定义的 Angular Schematics

    本文对 Angular Schematics 进行了介绍,并创建了一个用于创建自定义 Component 的 Schematics ,然后在 Angular 项目中以它为模板演练了通过 Schemat ...

  7. Weex与Android交互(二)

    扩展Android Weex 提供了扩展机制,可以根据自己的业务进行定制自己的功能. 主要分为两类扩展: Module 扩展 非UI的特定功能.例如sendHttp.openURL 等. Compon ...

  8. Angular(二) - 组件Component

    1. 组件Component示例 2. Component常用的几个选项 3. Component全部的选项 3.1 继承自@Directive装饰器的选项 3.2 @Component自己特有的选项 ...

  9. 「免费开源」基于Vue和Quasar的前端SPA项目crudapi后台管理系统实战之自定义组件(四)

    基于Vue和Quasar的前端SPA项目实战之序列号(四) 回顾 通过上一篇文章 基于Vue和Quasar的前端SPA项目实战之布局菜单(三)的介绍,我们已经完成了布局菜单,本文主要介绍序列号功能的实 ...

随机推荐

  1. CS4.1 RPM打包函数分析

    shell举例说明:脚本名称叫test.sh 入参三个: 1 2 3运行test.sh 1 2 3后$*为"1 2 3"(一起被引号包住)$@为"1" &quo ...

  2. spring4-2-bean配置-4-bean之间的关系

  3. Zookeeper使用--开源客户端

    一.ZkClient ZkClient是在Zookeeper原生API接口之上进行了包装,是一个更易用的Zookeeper客户端,其内部还实现了诸如Session超时重连.Watcher反复注册等功能 ...

  4. N-Gram的数据结构

    ARPA的n-gram语法如下: [html] view plaincopyprint? \data\ ngram 1=64000 ngram 2=522530 ngram 3=173445 \1-g ...

  5. 没有Reduce的MapReduce(一)

    尝试了一个没有Reduce的MapReduce. [应用场景]: 从Hbase的A表中进行数据抽样,直接输出到B表中. 这种场景下,相当于只进行了一个数据检索,本来是用Hive就可以实现,但是考虑到业 ...

  6. 无归档情况下使用BBED处理ORA-01113错误

    在丢失归档情况下,恢复时常会遇到ora-01113错误,以下实验模拟表空间offline,然后在丢失归档文件的情况下使用BBED修改文件头信息,最后恢复数据文件: 数据库版本: SQL> sel ...

  7. libxml2

    http://www.xmlsoft.org/downloads.html   建议直接用openscenegraph下载的3rdparty:http://www.openscenegraph.org ...

  8. CentOS7 Failed to start LSB: Bring up/down

    原文地址:http://addam.blog.51cto.com/5041993/1839518 刚刚装好的虚拟机突然不能上网了,报错很诡异,具体报错如下: /etc/init.d/network r ...

  9. Spring框架总结(九)

    三.AOP编程 关注点代码:除了业务代码以外的代码.比如开启事务,关闭事务,异常处理核心业务代码:保存用户这一句才是重点.例子如下:// 保存一个用户public void add(User user ...

  10. How attach Java source(为eclipseIDE附加资源)

    In Eclipse, when you press Ctrl button and click on any  Class names, the IDE will take you to the s ...