Replace height percent setting with flex: 1
This way reacts better to changing the screen sizes. I think there was one bug where the fab wouldn't be precisely at the bottom of the page depending on the flat list length.
This commit is contained in:
parent
46f0875497
commit
9bd8fa9353
|
@ -65,11 +65,7 @@ export default function BestList() {
|
||||||
description="Once sets have been added, this will highlight your personal bests."
|
description="Once sets have been added, this will highlight your personal bests."
|
||||||
/>
|
/>
|
||||||
) : (
|
) : (
|
||||||
<FlatList
|
<FlatList style={{flex: 1}} renderItem={renderItem} data={bests} />
|
||||||
style={{height: '99%'}}
|
|
||||||
renderItem={renderItem}
|
|
||||||
data={bests}
|
|
||||||
/>
|
|
||||||
)}
|
)}
|
||||||
</Page>
|
</Page>
|
||||||
);
|
);
|
||||||
|
|
|
@ -87,8 +87,8 @@ export default function EditPlan() {
|
||||||
);
|
);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<View style={{padding: PADDING}}>
|
<View style={{padding: PADDING, flex: 1}}>
|
||||||
<ScrollView style={{height: '90%'}}>
|
<ScrollView style={{flex: 1}}>
|
||||||
<Text style={styles.title}>Days</Text>
|
<Text style={styles.title}>Days</Text>
|
||||||
{DAYS.map(day => (
|
{DAYS.map(day => (
|
||||||
<Switch
|
<Switch
|
||||||
|
|
|
@ -118,8 +118,8 @@ export default function EditWorkout() {
|
||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<View style={{padding: PADDING}}>
|
<View style={{padding: PADDING, flex: 1}}>
|
||||||
<ScrollView style={{height: '90%'}}>
|
<ScrollView style={{flex: 1}}>
|
||||||
<MassiveInput
|
<MassiveInput
|
||||||
autoFocus
|
autoFocus
|
||||||
label="Name"
|
label="Name"
|
||||||
|
|
|
@ -18,7 +18,7 @@ export default function MassiveFab(
|
||||||
style={{
|
style={{
|
||||||
position: 'absolute',
|
position: 'absolute',
|
||||||
right: 10,
|
right: 10,
|
||||||
bottom: 60,
|
bottom: 10,
|
||||||
backgroundColor: color,
|
backgroundColor: color,
|
||||||
}}
|
}}
|
||||||
{...props}
|
{...props}
|
||||||
|
|
1
Page.tsx
1
Page.tsx
|
@ -34,6 +34,5 @@ const styles = StyleSheet.create({
|
||||||
container: {
|
container: {
|
||||||
flexGrow: 1,
|
flexGrow: 1,
|
||||||
padding: PADDING,
|
padding: PADDING,
|
||||||
paddingBottom: '10%',
|
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
|
@ -54,7 +54,7 @@ export default function PlanList() {
|
||||||
/>
|
/>
|
||||||
) : (
|
) : (
|
||||||
<FlatList
|
<FlatList
|
||||||
style={{height: '99%'}}
|
style={{flex: 1}}
|
||||||
data={plans}
|
data={plans}
|
||||||
renderItem={renderItem}
|
renderItem={renderItem}
|
||||||
keyExtractor={set => set.id?.toString() || ''}
|
keyExtractor={set => set.id?.toString() || ''}
|
||||||
|
|
|
@ -95,7 +95,7 @@ export default function SetList() {
|
||||||
) : (
|
) : (
|
||||||
<FlatList
|
<FlatList
|
||||||
data={sets}
|
data={sets}
|
||||||
style={{height: '99%'}}
|
style={{flex: 1}}
|
||||||
renderItem={renderItem}
|
renderItem={renderItem}
|
||||||
keyExtractor={s => s.id!.toString()}
|
keyExtractor={s => s.id!.toString()}
|
||||||
onEndReached={next}
|
onEndReached={next}
|
||||||
|
|
|
@ -88,7 +88,7 @@ export default function WorkoutList() {
|
||||||
) : (
|
) : (
|
||||||
<FlatList
|
<FlatList
|
||||||
data={workouts}
|
data={workouts}
|
||||||
style={{height: '99%'}}
|
style={{flex: 1}}
|
||||||
renderItem={renderItem}
|
renderItem={renderItem}
|
||||||
keyExtractor={w => w.name}
|
keyExtractor={w => w.name}
|
||||||
onEndReached={next}
|
onEndReached={next}
|
||||||
|
|
Loading…
Reference in New Issue
Block a user