Add ScrollView and Portal.Host to Subjects. Add margin to last card.

Move FAB inside Portal
This commit is contained in:
Ceda EI 2020-03-20 00:13:34 +05:30
parent bbf55e1c7e
commit dee71bec11
1 changed files with 30 additions and 16 deletions

View File

@ -4,10 +4,12 @@ import {
Button,
Card,
FAB,
Portal,
Text
} from "react-native-paper";
import {
ScrollView,
StyleSheet
} from "react-native";
@ -20,13 +22,23 @@ export default function Subjects({ subjects, addSubject, removeSubject }) {
setShowDialog(false);
}
return (
<>
<Portal.Host><ScrollView>
{subjects.length === 0 ?
<Text style={style.text}>No Subjects added. Press + to add a subject.</Text>
<Text style={style.text}>
No Subjects added. Press + to add a subject.
</Text>
: null
}
{subjects.map(subject => (
<Card key={subject.id} style={style.card}>
{subjects.map((subject, idx) => (
<Card
key={subject.id}
style={
[
style.card,
{marginBottom: idx === subjects.length - 1 ? 12 : 0 }
]
}
>
<Card.Title title={subject.name} />
<Card.Actions>
<Button onPress={() => removeSubject(subject.id)}>
@ -43,6 +55,7 @@ export default function Subjects({ subjects, addSubject, removeSubject }) {
label="Subject Name"
onOK={onInput}
/>
<Portal>
<FAB
large
icon="plus"
@ -54,7 +67,8 @@ export default function Subjects({ subjects, addSubject, removeSubject }) {
bottom: 0,
}}
/>
</>
</Portal>
</ScrollView></Portal.Host>
);
}