我想就如何在React本机中制作可折叠项目提供一些建议。我试过使用:react-native-collapsible甚至:react-native-accordion。但是似乎oblador的一个在此版本的React native上不再起作用,而另一个则很难使用或自定义。这是我想做的:
我将代码分成2个文件,一个用于自定义视图,另一个输入其标题和项目。
手风琴
class AccordionCustom extends Component{
constructor(props){
super(props);
this.icons = {
'up' : require('../image/keyboard_arrow_right_black_192x192.png'),
'down' : require('../image/keyboard_arrow_down_black_192x192.png')
};
this.state = {
title: props.title,
expanded: true,
animation: new Animated.Value()
};
}
toggle(){
let
initialValue = this.state.expanded? this.state.maxHeight + this.state.minHeight : this.state.minHeight,
finalValue = this.state.expanded? this.state.minHeight : this.state.maxHeight + this.state.minHeight;
this.setState({
expanded : !this.state.expanded
});
this.state.animation.setValue(initialValue);
Animated.spring(
this.state.animation,
{
toValue: finalValue
}
).start();
}
_setMaxHeight(event){
this.setState({
maxHeight : event.nativeEvent.layout.height
});
}
_setMinHeight(event){
this.setState({ …Run Code Online (Sandbox Code Playgroud)