weex 自定义Component
~ 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的更多相关文章
- Ionic2学习笔记(2):自定义Component
作者:Grey 原文地址: http://www.cnblogs.com/greyzeng/p/5536298.html 上一篇提到,Ionic2提供了很多Co ...
- weex 自定义Modul
扩展iOS的功能 一. 新建 NSOjbect 子类, 并遵循协议<WXModuleProtocol> .h 代码 #import <Foundation/Foundation.h& ...
- #Weex与Android交互(一)
用Weex开发Android程序 参考:开发HelloWorld程序(Weex开发) 1.创建Android工程 2.集成WeexSDK,参考[WEEX SDK 集成到 Android 工程](htt ...
- 第八章 交互技术,8.4 Weex 双11会场大规模应用的秒开实战和稳定性保障(作者:鬼道)
8.4 Weex 双11会场大规模应用的秒开实战和稳定性保障 前言 Native 开发的诸多亮点中,流畅体验和系统调用是最多被提及的.流畅体验体现在页面滚动/动画的流畅性,背后是更好的内存管理和更接近 ...
- salesforce lightning零基础学习(四) 事件(component events)简单介绍
lightning component基于事件驱动模型来处理用户界面的交互.这种事件驱动模型和js的事件驱动模型也很相似,可以简单的理解成四部分: 1.事件源:产生事件的地方,可以是页面中的输入框,按 ...
- 创建自定义的 Angular Schematics
本文对 Angular Schematics 进行了介绍,并创建了一个用于创建自定义 Component 的 Schematics ,然后在 Angular 项目中以它为模板演练了通过 Schemat ...
- Weex与Android交互(二)
扩展Android Weex 提供了扩展机制,可以根据自己的业务进行定制自己的功能. 主要分为两类扩展: Module 扩展 非UI的特定功能.例如sendHttp.openURL 等. Compon ...
- Angular(二) - 组件Component
1. 组件Component示例 2. Component常用的几个选项 3. Component全部的选项 3.1 继承自@Directive装饰器的选项 3.2 @Component自己特有的选项 ...
- 「免费开源」基于Vue和Quasar的前端SPA项目crudapi后台管理系统实战之自定义组件(四)
基于Vue和Quasar的前端SPA项目实战之序列号(四) 回顾 通过上一篇文章 基于Vue和Quasar的前端SPA项目实战之布局菜单(三)的介绍,我们已经完成了布局菜单,本文主要介绍序列号功能的实 ...
随机推荐
- 关于HBase的memstoreFlushSize。
memstoreFlushSize是什么呢? memstoreFlushSize为HRegion上设定的一个阈值,当MemStore的大小超过这个阈值时,将会发起flush请求. 它的计算首先是由Ta ...
- smarty类与对象的赋值与使用
<?phprequire_once('../smarty/Smarty.class.php'); //配置信息$smarty=new Smarty(); $smarty->left_del ...
- maven环境快速搭建(转)
出处:http://www.cnblogs.com/fnng/archive/2011/12/02/2272610.html 最近,开发中要用到maven,所以对maven进行了简单的学习.因为有个m ...
- HDU 6096 String (AC自动机)
题意:给出n个字符串和q个询问,每次询问给出两个串 p 和 s .要求统计所有字符串中前缀为 p 且后缀为 s (不可重叠)的字符串的数量. 析:真是觉得没有思路啊,看了官方题解,真是好复杂. 假设原 ...
- SecondaryNameNode中的“Inconsistent checkpoint fields”错误原因
该错误原因,可能是因为没有设置好SecondaryNameNode上core-site.xml文件中的"hadoop.tmp.dir". 2014-04-17 11:42:18,1 ...
- win32 zbar
一.zbar官方介绍 ZBar 是款桌面电脑用条形码/二维码扫描工具,支持摄像头及图片扫描,支持多平台,例如 iPhone,Andriod 手机,同时 ZBar封装了二维码扫描的 API 开发包. Z ...
- (自己转)比较ArrayList、LinkedList、Vector
1. List概述 List,就如图名字所示一样,是元素的有序列表.当我们讨论List时,将其与Set作对比是一个很好的办法,Set集合中的元素是无序且唯一的.下图是Collection的类继承图,从 ...
- Android colorAccent、colorPrimary、colorPrimaryDark actionbar toolbar navigationbar
伴随着Android5.0的发布也更新了support-v7-appcompat 到V21,其中增加了ToolBar.recyclerview.cardview等控件. Android5.0对改变AP ...
- .net 可选参数和命名参数
可选参数,可以为方法的参数设置默认值,在调用方法的时候,如果不传递参数,就是执行默认参数. class Program { , string s = "A", DateTime d ...
- MVC4 Action 两种异步方式
1. xxxAsync/xxxCompleted 组合方式异步,xxxCompleted 就是他的回调函数,在执行完 xxxAsync 后调用xxxCompleted . 使用 异步方式必须继承A ...