android 全局文字颜色,android – 全局“文本”颜色和“TextInput”文本颜色

为了获得Text元素(或React Native应用程序中使用的任何其他基本元素)的一致样式,我们的团队已经开始为我们的应用程序构建一个组件库,它们与我们设计的样式指南的样式和命名相匹配球队.

例如,您的文本组件将如下所示：

import React, { PropTypes, Component } from 'react';

import ReactNative from 'react-native';

export default class Text extends Component {

getProps() {

const { fontSize, fontWeight } = this.props;

return {

fontSize,

fontWeight,

};

}

render() {

return (

{this.props.children}

);

}

}

Text.propTypes = {

fontSize: PropTypes.oneOf([

25,

20,

15,

]),

fontWeight: PropTypes.oneOf([

'normal',

'bold',

]),

};

Text.defaultProps = {

fontSize: 20,

fontWeight: 'normal',

};

以这种方式创建文本组件,您可以定义可用的样式,并向开发人员发出警告,如果他们不使用PropTypes定义的有效样式.

我们还希望能够从您需要的任何文件中轻松地引用此库中的组件,因此我们为主库文件提供了一个名称,其中包含一些内部React Native组件使用的provideModule注释.

主库文件看起来像这样.

/**

* @providesModule AppNameLibrary

*/

module.exports = {

get Text() { return require('./Text').default; },

};

然后,您只需要在任何需要自定义Text组件的组件文件中导入它.

import { Text } from 'AppNameLibrary';

这是一种方法.不确定这是否是最佳方式,但这是我们团队构建组件的好方法,因此它们的设计始终如一,符合我们的风格指南.

至于更改Android TextInput组件的文本颜色,只需指定一种颜色：’orange’作为样式,将文本更改为橙色.我们此时正在使用RN 0.28.