0
試圖渲染我的場景,其中包含SlideMenu,其中每個項目改變我的內容的瀏覽,我得到這個錯誤:陣營原生不支持的佈局動畫
[RCTLog][tid:0x7f8f7054b4b0]
[RCTUIManager.m:466]>Unsupported layout animation createConfig property (null)
我想這來自於佈局的動畫的SlideMenu,但只有當它觸發點擊某個項目時點擊「片段」(意味着內容視圖)時纔會發生。否則,菜單正常關閉。
單擊「解除」時,我的片段顯示得很好,但沒有看到SlideMenu關閉。
我不知道這是來自動畫本身還是動畫元素和動畫組合的變化。
下面是一些我的代碼:
toggleSlideMenu: function() {
if (this.state.slideMenuIsAccessible){
if(this.state.menuIsOpen) {
//close Menu
} else {
//open Menu
}
queueAnimation(this.props.animation);
this.center.setNativeProps({left: this.offset}); //updates UI
}
});
爲了片段選擇發生在generalTemplate:
matchIdToFragment: function(fragmentId) {
switch (fragmentId) {
case 'suggestions':
return <Suggestions />;
case 'onScreen':
return <OnScreen />;
case 'zap':
return <Zap setFragmentId={this.props.setFragmentId} setItemId={this.setItemId}/>;
case 'programDetails':
return <ProgramDetails itemId={this.state.itemId}/> ;
}
},
render: function() {
var fragment = this.matchIdToFragment(this.props.fragmentId);
return (
<View style={styles.container}>
<View style={styles.fragmentView}>
{fragment}
</View>
<NavigationBar
onOpenUserMenu={this.onOpenUserMenu}
toggleSlideMenu={this.toggleSlideMenu}/>
</View>
);
}
在菜單按項目觸發菜單的關閉(併發送ID,它這裏沒有出現,一般模版:
var Section = React.createClass({
onPress: function() {
this.props.toggleSlideMenu();
},
render: function() {
return (
<TouchableHighlight underlayColor='#DFDFDF' onPress={this.onPress}>
//Name and icon of the menu item
</TouchableHighlight>
);
}
});
而且代碼t他的動畫(不知道它是有用的,但我們永遠不知道):
var LayoutAnimation = require('react-native').LayoutAnimation;
var DEFAULT_ANIMATION = 'linear';
var animations = {
layout: {
linear: {
duration: 300,
create: {
type: LayoutAnimation.Types.linear,
},
update: {
type: LayoutAnimation.Types.linear,
springDamping: 0.7,
},
},
},
};
var layoutAnimationConfigs = {
'spring': animations.layout.spring,
};
module.exports = function(animation) {
var _animation = layoutAnimationConfigs[animation];
if (!_animation) {
_animation = layoutAnimationConfigs[DEFAULT_ANIMATION];
}
LayoutAnimation.configureNext(_animation);
}