1.
这种3目,两种选择的组件是一个类型 ,记得加 key, 不然会混淆,切换的不对
2.React-native jsx 九宫格 写法:
<Image
source={require('../../../img/miniGame/yuezhan/yuezhan_title.png') }
resizeMode = 'stretch'
style={{ width: stretchWidth,height: stretchHeight,alignSelf: 'center' }}
capInsets={{ top: 42,left: 22,bottom: 6,right: 22 }} >
</Image>
3.展现定宽高的横向listView:
<ListView
style={{height: 135}} //这个是listView 可看到的大小,不要设置 content 大小
initialListSize ={20} // 这个要设置的,默认是10个好像
enableEmptySections={true}
dataSource={this.state.dataSource}
renderRow={this._renderRow.bind(this) }
contentContainerStyle={{ flexDirection: 'row',flexWrap: 'wrap',paddingBottom: 5 }}
/>
4.TableView 切换成可 (拖动排序,左滑删除)状态的使用方法:
render() {
let sections = null;
let items = this.state.obj.map((u,i) => (
<Item key={i} tag={u.label}/>
));
sections = (
<Section canEdit={true} canMove={true}> // 这个地方不要用state变量,切换状态不流畅
{items}
</Section>
);
return (
<View style={{ flex: 1,flexDirection: 'row',backgroundColor: 'lightgrey' }}>
<TableView
ref='tableview'
editing={true}
reactModuleForCell='GroupTagCell'
onChange={this._onChange.bind(this) }
style={{ flex: 1 }}
>
{sections}
</TableView>
</View>
);
6.如果你用了 redux,请把需要缓存的放入action(比如音效状态),其他的就跟界面文件一起写。 redux 会缓存,让你第二启动界面,有一个很尴尬的过渡过程。
7.ListView 里面的 renderRow 渲染 cell 方法里,慎用 flex:1 。