We have stickyHeaderIndices for row, I couldn't find any solution for column.
CodePudding user response:
This might help
<FlatList
data={[...]}
...
ListHeaderComponent={this.Render_FlatList_Sticky_header}
stickyHeaderIndices={[0]}
/>
CodePudding user response:
You could make this layout with nested Flatlists
import * as React from 'react';
import { Text, View, FlatList, StyleSheet } from 'react-native';
const data = [
{
title: 'Testing1',
cols: ['1234', '1234', '1234'],
},
{
title: 'Testing2',
cols: ['1234', '1234', '1234'],
},
{
title: 'Testing3',
cols: ['1234', '1234', '1234'],
},
{
title: 'Testing4',
cols: ['1234', '1234', '1234'],
},
{
title: 'Testing5',
cols: ['1234', '1234', '1234'],
},
{
title: 'Testing6',
cols: ['1234', '1234', '1234'],
},
];
export default function App() {
return (
<FlatList
data={data}
renderItem={({ item }) => (
<View
style={{
flexDirection: 'row',
}}>
<Text style={{ padding: 40, backgroundColor: 'white', flexGrow: 0 }}>
{item.title}
</Text>
<FlatList
horizontal={true}
data={item.cols}
renderItem={({ item }) => (
<Text style={{ padding: 40 }}>{item}</Text>
)}
/>
</View>
)}
/>
);
}