ReactNative Text 组件
来源:互联网 发布:Linux命令dd与cp区别 编辑:程序博客网 时间:2024/05/18 11:01
ReactNative Text 组件。
import React, {Component} from 'react';import { AppRegistry, StyleSheet, Text, View, TouchableOpacity, TextInput, Image,} from 'react-native';let RnDemo = React.createClass({ render: function () { //定义数组存储新闻信息 var news = ["1.------", "2-------", "3-------", "4----------------------------------" +"--------------------------------------------" +"-----------------------------------"]; return ( <View style={styles.item}> {/*Header*/} <Header/> {/*News*/} <News news={news}/> </View> ); }});let styles = StyleSheet.create({ flex: { flex: 1, }});//组件let Header = React.createClass({ render: function () { return ( <View style={styles.flex}> <Text style={styles.font}> <Text style={styles.font_1}>网易</Text> <Text style={styles.font_2}>新闻</Text> <Text>有态度</Text> </Text> </View> ); }});//样式let styles = StyleSheet.create({ flex: { marginTop: 25, height: 40, borderBottomWidth: 1, borderBottomColor: "#EF2D36", alignItems: "center", }, //字体设置的公共部分 font: { fontSize: 25, fontWeight: "bold", textAlign: "center", }, font_1: { color: "#CD1D1C", }, font_2: { color: "#FFF", backgroundColor: "#CD1D1C", }});
阅读全文
1 0
- ReactNative Text 组件
- ReactNative开发——Text组件
- 【原创】东方耀reactnative 视频13之-Text组件
- ReactNative-Image组件
- ReactNative-Picker组件
- ReactNative-Switch开关组件
- ReactNative-WebView组件
- ReactNative开源组件
- ReactNative组件生命周期
- reactNative Navigator导航组件
- ReactNative-WebView组件
- ReactNative 图片列表组件
- ReactNative View 组件
- ReactNative Touchable 组件
- ReactNative TextInput 组件
- ReactNative Image 组件
- ReactNative ScollView 组件
- ReactNative ListView 组件
- charles(青花瓷)抓包乱码【青花瓷抓包https内容】
- Android2.3.3 Kotlin使用Android DataBinding配置
- mac 使用 brew
- Tomcat配置url直接访问物理地址
- Java中的重写和重载
- ReactNative Text 组件
- Android RecyclerView 基本用法&进阶
- ButterKnife简单使用和注意事项
- EasyPermissions的使用方法
- JVM性能调优(一)
- 【大数据部落】银行信用数据SOM神经网络聚类实现
- Osquery生态
- 原型链的认识
- Easyui-combotree下拉框组合树