2、e={styles.container}>{this.names.map((item,i)=>{return(this.items[i]=ref}key={i}style={[style
3、s.item,{top:(i+1)*49}]}>{item});})});}前面NavigationBar部分不用看，自己封裝的組件，通過map函數(shù)，可以依次遍歷每個(gè)數(shù)組元素(this.names=['Android','iOS','前端','拓展資源','休息視頻'];)。因?yàn)槲覀冃枰竺婺苤苯涌刂泼總€(gè)DOM（后面會(huì)直接操控
4、它的樣式），所以需要添加ref屬性，不熟悉或者不明白ref這個(gè)prop的，可以參考這里。還需要注意的地方是，因?yàn)槲覀兊膇tem是可以拖拽移動(dòng)的，能直接操控它們位置屬性的就是絕對(duì)和相對(duì)布局，提供了top，left，right，bottom這些個(gè)props。貼一下item的stylesheet。[javascript]viewplaincopy在CODE上查看代碼片派生到我的代碼片item:{flexDirection:'row',height:px2dp(49),width:theme.screenWidth,alignIte
5、ms:'center',backgroundColor:'#fff',paddingLeft:px2dp(20),borderBottomColor:theme.segment.color,borderBottomWidth:theme.segment.width,position:'absolute',},不用在意其他的props，最關(guān)鍵的最起作用的就是position屬性，一旦設(shè)置，該View的位置就不會(huì)受控于flexbox的布局了，直接浮動(dòng)受控于top，left這幾個(gè)參數(shù)。對(duì)于{...this._panResponde
6、r.panHandlers}這個(gè)屬性，就會(huì)談到React-native中的手勢(shì)，也就是我們下一個(gè)內(nèi)容。item可點(diǎn)擊突出顯示如果不了解react-native中的手勢(shì)，建議簡(jiǎn)單去了解下，直通車在這里還有這個(gè)。一旦需要自己實(shí)現(xiàn)手勢(shì)，我們需要實(shí)現(xiàn)這幾個(gè)方法。[javascript]viewplaincopy在CODE上查看代碼片派生到我的代碼片onStartShouldSetPanResponder:(evt,gestureState)=>true,／／開啟手勢(shì)響應(yīng)onMoveShouldSetPanResponder:(evt
7、,gestureState)=>true,／／開啟移動(dòng)手勢(shì)響應(yīng)onPanResponderGrant:(evt,gestureState)=>{／／手指觸碰屏幕那一刻觸發(fā)},onPanResponderMove:(evt,gestureState)=>{／／手指在屏幕上移動(dòng)觸發(fā)},onPanResponderTerminationRequest:(evt,gestureState)=>true,／／當(dāng)有其他不同手勢(shì)出現(xiàn)，響應(yīng)是否中止當(dāng)前的手勢(shì)onPanResponderRelease:(evt,gestureState)=>
8、{／／手指離開屏幕觸發(fā)},onPanResponderTerminate:(evt,gestureState)=>{／／當(dāng)前手勢(shì)中止觸發(fā)},簡(jiǎn)單介紹了下幾個(gè)函數(shù)的意義，所以很明顯，要實(shí)現(xiàn)item點(diǎn)擊突出顯示，我們需要在onPanRespondedGrant這里做事情。貼代碼來解釋，[jav
