zoriya/Chromacase
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Removed Scrollview from ScaffoldMobile and now each view implement its scroll

Browse Source
This commit is contained in:
Clément Le Bihan
2023-11-26 18:37:05 +01:00
parent 624b640e01
commit 6a8fe074e0
4 changed files with 71 additions and 77 deletions
Download Patch File Download Diff File Expand all files Collapse all files
front/views/V2/DiscoveryView.tsx
+54 -57
View File
@@ -38,78 +38,75 @@ const HomeView = (props: RouteProps<{}>) => {
// }, [artistsQueries]);
return (
// <ScaffoldCC routeName={props.route.name}>
<ScrollView>
<View
style={{
width: '100%',
height: '100%',
display: 'flex',
flexDirection: 'column',
gap: 16,
}}
>
<View
style={{
width: '100%',
maxWidth: 1100,
// maxHeight: 500,
// aspectRatio: 1.618,
// golden ratio in vertical
aspectRatio: 0.618,
}}
>
<GoldenRatio />
</View>
<ScaffoldCC routeName={props.route.name}>
<ScrollView>
<View
style={{
width: '100%',
display: 'flex',
flexDirection: 'column',
flexWrap: 'wrap',
justifyContent: 'center',
alignItems: 'center',
gap: 16,
}}
>
<Text
style={{
fontSize: 24,
fontWeight: 'bold',
marginLeft: 16,
marginBottom: 16,
marginTop: 24,
}}
>
{'Suggestions'}
</Text>
{songsQuery.isLoading && <Text>Loading...</Text>}
<View
style={{
width: '100%',
flexDirection: 'row',
flexWrap: 'wrap',
justifyContent: 'center',
alignItems: 'flex-start',
maxWidth: 1100,
// maxHeight: 500,
// aspectRatio: 1.618,
// golden ratio in vertical
aspectRatio: 0.618,
}}
>
<GoldenRatio />
</View>
<View
style={{
width: '100%',
flexDirection: 'column',
justifyContent: 'flex-start',
alignItems: 'stretch',
gap: 16,
}}
>
{songsQuery.data?.map((song) => (
<SongCardInfo
key={song.id}
song={song}
onPress={() => {
navigation.navigate('Play', { songId: song.id });
}}
onPlay={() => {
console.log('play');
}}
/>
))}
<Text
style={{
fontSize: 24,
fontWeight: 'bold',
marginLeft: 16,
marginBottom: 16,
marginTop: 24,
}}
>
{'Suggestions'}
</Text>
{songsQuery.isLoading && <Text>Loading...</Text>}
<View
style={{
flexDirection: 'row',
flexWrap: 'wrap',
justifyContent: 'center',
alignItems: 'flex-start',
gap: 16,
}}
>
{songsQuery.data?.map((song) => (
<SongCardInfo
key={song.id}
song={song}
onPress={() => {
navigation.navigate('Play', { songId: song.id });
}}
onPlay={() => {
console.log('play');
}}
/>
))}
</View>
</View>
</View>
</View>
</ScrollView>
// </ScaffoldCC>
</ScrollView>
</ScaffoldCC>
);
};