android开源日期控件,详解ReactNative开源时间日期选择器组件(react...

android开源日期控件,详解ReactNative开源时间日期选择器组件(react...

2023年6月27日发(作者:)

android开源⽇期控件,详解ReactNative开源时间⽇期选择器组件(react-。。。项⽬介绍该组件进⾏封装⼀个时间⽇期选择器,同时适配Android、iOS双平台,该组件基于@remobile/react-native-datetime-picker进⾏开发⽽来配置安装npm install react-native-datetime --环境配置上⾯步骤完成之后,直接前台写js代码即可d环境配置在android/⽂件中如下配置...include ':react-native-datetime'project(':react-native-datetime').projectDir = new File(tDir, '../node_modules/react-native-datetime/android')在android/app/⽂件中如下配置...dependencies {...compile project(':react-native-datetime')}在中进⾏注册模块①.React Native>=0.18开始import me.*; //public class MainActivity extends ReactActivity {....../*** A list of packages used by the app. If the app uses additional views* or modules besides the default ones, add more packages here.*/@Overrideprotected List getPackages() {return (new RCTDateTimePickerPackage(this), //new MainReactPackage());}}①.React Native<=0.17版本import me.*; //public class MainActivity extends Activity implements DefaultHardwareBackBtnHandler {......@Overrideprotected void onCreate(Bundle savedInstanceState) {te(savedInstanceState);mReactRootView = new ReactRootView(this);mReactInstanceManager = r().setApplication(getApplication()).setBundleAssetName("").setJSMainModuleName("d").addPackage(new MainReactPackage()).addPackage(new RCTDateTimePickerPackage(this)) //.setUseDeveloperSupport().setInitialLifecycleState(D).build();eactApplication(mReactInstanceManager, "ExampleRN", null);setContentView(mReactRootView);}......}运⾏截图ios运⾏效果android运⾏效果使⽤⽅法{=picker}}/>...tePicker(...)mePicker(...)teTimePicker(...)在ios平台上⾯使⽤,需要确保当前DataTimePicker视图在顶部使⽤实例'use strict';var React = require('react-native');var {StyleSheet,TouchableOpacity,View,Text,} = React;var DateTimePicker = require('react-native-datetime');var Button = require('@remobile/react-native-simple-button');s = Class({getInitialState() {return {date: new Date(),}},showDatePicker() {var date = ;tePicker(date, (d)=>{te({date:d});});},showTimePicker() {var date = ;mePicker(date, (d)=>{te({date:d});});},showDateTimePicker() {var date = ;teTimePicker(date, (d)=>{te({date:d});});},render() {return ({ng()}showDatePickershowTimePickershowDateTimePicker{=picker}}/>);},});var styles = ({container: {flex: 1,justifyContent: 'center',paddingTop:20,},});⽅法介绍showDatePicker(date, callback(date))showTimePicker(date, callback(date))showDateTimePicker(date, callback(date))属性介绍cancelText (default: Cancel)okText (default: Ok)以上就是本⽂的全部内容,希望对⼤家的学习有所帮助,也希望⼤家多多⽀持脚本之家。

发布者:admin,转转请注明出处:http://www.yc00.com/web/1687841925a49983.html

相关推荐

发表回复

评论列表(0条)

  • 暂无评论

联系我们

400-800-8888

在线咨询: QQ交谈

邮件:admin@example.com

工作时间:周一至周五,9:30-18:30,节假日休息

关注微信