当我长按要显示弹出对话框以输入备注的flatlist数据时,我正在使用flatlist来显示数据
这是onlongpress功能
saveGroup (){
console.log("Long Press");
this.setState({
visibleGroup: "true",
});
}
这是渲染行,当我长按数据以显示弹出对话框以输入备注
renderRow = (item) => {
if(item.type=="D"){
this.state.typetext="Dent"
}
if(item.type=="S"){
this.state.typetext="Scratch"
}
if(item.type=="C"){
this.state.typetext="Crack"
}
return (
<ScrollView>
<View style={customStyles.listViewContainer} >
<View style={{ flex: 1 }}>
<TouchableOpacity
underlayColor='#dddddd' onLongPress={() => this.saveGroup()}
>
<View style={{ flexDirection: "column", alignItems: "flex-start" }}>
{
this.state.typetext == "Dent" ?
<View style={{ flexDirection: "row" }} >
<Text style={{ marginLeft: 5, marginTop: 5, marginBottom: 3, fontWeight: "bold", color: "black" }}>{item.id}</Text>
<Text style={{ marginLeft: 5,marginTop: 5, marginBottom: 3}}>{this.state.typetext}</Text>
<Image
source={require("./../../resource/circle.png")}
style={{ resizeMode: "cover", width: 10, height: 10,marginLeft: 5,marginTop: 5 }}
/>
</View> : <View/> }
{
this.state.typetext == "Scratch" ?
<View style={{ flexDirection: "row" }} >
<Text style={{ marginLeft: 5, marginTop: 5, marginBottom: 3, fontWeight: "bold", color: "black" }}>{item.id}</Text>
<Text style={{ marginLeft: 5, marginTop: 5, marginBottom: 3}}>{this.state.typetext}</Text>
<Image
source={require("./../../resource/star.png")}
style={{ resizeMode: "cover", width: 10, height: 10,marginLeft: 5,marginTop: 5 }}
/>
</View> : <View/> }
{
this.state.typetext == "Crack" ?
<View style={{ flexDirection: "row" }}>
<Text style={{ marginLeft: 5, marginTop: 5, marginBottom: 3, fontWeight: "bold", color: "black" }}>{item.id}</Text>
<Text style={{ marginLeft: 10, marginTop: 5, marginBottom: 3}}>{this.state.typetext}</Text>
<Image
source={require("./../../resource/exclamation.png")}
style={{ resizeMode: "cover", width: 10, height: 10,marginLeft: 5,marginTop: 5 }}
/>
</View> : <View/> }
</View>
<View style={{flexDirection:"row"}}><TouchableOpacity>
<Text style={{ color: "white", backgroundColor: "#FE7C2D",
padding: 5, marginTop: 10, marginBottom:10 , fontSize: 12,marginLeft:10}}> Remove</Text></TouchableOpacity>
<View style={{flexDirection:"column",marginRight:"auto"}} ><TouchableOpacity>
<Text style={{ color: "white", backgroundColor: "#746766",
padding: 5, marginTop: 10, fontSize: 12,marginLeft:10, }}> pending</Text></TouchableOpacity>
</View>
</View>
</TouchableOpacity>
</View>
<Dialog width="95%"
visible={this.state.visibleGroup}
onTouchOutside={() => {
this.setState({ visibleGroup: false });
}}
dialogTitle={
< DialogTitle title={"Enter Service remarks"} />
}
footer={
<DialogFooter><DialogButton text="Cancel" style="{{color: '#ffaf49'}}" onPress={() => {}} />
<DialogButton text="Save" style="{{color: '#ffaf49'}}" onPress={() => {}} /></DialogFooter>
}
>
<DialogContent>
<Container>
<TextInput
style={customStyles.inputsRemarksGroup}
multiline={true}
numberOfLines={4}
placeholder="Enter Remarks"
underlineColorAndroid="transparent"
// value={this.state.remarksGroup}
// onChangeText={this.handleRemarksGroup}
/>
</Container>
</DialogContent>
</Dialog>
</View>
</ScrollView>
);
*和名单*
render() {
let { data, checked } = this.state;
if (!this.state.ready) {
return (
<ActivityIndicator
animating={true}
style={customStyles.indicator}
color="#ffc77d"
size="large"
/>
);
}
if (this.state.ready) {
return (
<FlatList
data={data}
extraData={this.state}
renderItem={({ item, index }) => (
this.renderRow(item, index)
)}
ListHeaderComponent={this.Render_FlatList_Sticky_header}
stickyHeaderIndices={[0]}
/>
);
}
}
当我长按平面列表数据时,对话框不起作用