手動設置TouchOpacity的不透明度

基本上我希望能夠隨意調整我的TouchOpacity組件不透明度。手動設置TouchOpacity的不透明度

這裏是我的代碼

<TouchableOpacity 
    className='Calculator' 
    style={ 
     [ 
     styles.container, 
     { 
      transform:[ 
      {translateX:this.props.anim.x} 
      ], 
     } 
     ] 
    } 
    onPress={this.hideKeyboard} 
    activeOpacity={1} 
    > 
    <AmountInput /> 

    </TouchableOpacity> 
);

只給一些背景： AmountInput是一個基本的文本輸入框。

我正在使用TouchableOpacity來按下時隱藏鍵盤。不過，我不希望它在印刷機上改變不透明度，我嘗試使用TouchableWithoutFeedback，但它的onPress事件無法與TextInput正常工作。

因爲我爲它的預期目的（改變觸摸不透明度）我有activeOpacity設置爲1我不使用TouchOpacity。這是重寫風格，但如果我擺脫它，比輸入框更改不透明當我觸摸它的容器！

任何人都知道解決的辦法？我有一個opacity變量被傳遞給道具。

編輯： 下面是使用TouchableWithoutFeedback

<TouchableWithoutFeedback 
    className='Calculator' 
    style={ 
     [ 
     styles.container, 
     { 
      opacity:1, 
      backgroundColor:'red', 
      transform:[ 
      {translateX:this.props.anim.x} 
      ], 
     } 
     ] 
    } 
    onPress={this.hideKeyboard} 
    > 
    <AmountInput /> 

    </TouchableWithoutFeedback>

但由於某些原因，所有我在標籤定義的屬性似乎都沒有影響一些代碼，我的backgroundColor樣式設置爲red它沒有做任何事情。

來源

2017-07-22 Gage Hendy Ya Boy

我在使用TouchableWithoutFeedback時發現了一個解決方案。看來你需要用它的孩子們在View標籤......哪怕只有一個，即使文檔狀態：

TouchableWithoutFeedback支持只生一個孩子。如果您希望有多個子組件，請將它們包裝在View中。

而且還我仍然不能夠任何樣式應用到TouchableWithoutFeedback標籤，我不得不把他們所有的View孩子。

這裏是我更新的代碼：

render() { 
return (
    <TouchableWithoutFeedback className='Calculator' onPressIn={this.hideKeyboard}> 
    <View style={ 
     [ 
     styles.container, 
     { 
      opacity:this.props.anim.opacity, 
      transform:[ 
      {translateX:this.props.anim.x} 
      ], 
     } 
     ] 
    }> 
     <AmountInput /> 
    </View> 
    </TouchableWithoutFeedback> 
);

}

我已經運行到了很多的困惑和矛盾的同陣營本地文檔。這是一個偉大的工具！文檔應該對新的反應開發人員更清楚和友好。

來源

2017-07-22 21:23:01

手動設置TouchOpacity的不透明度

回答

相關問題