leonm/musicland
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
Philip Cesar Garay
2025-08-26 18:08:09 +08:00
parent b9f7c4b4a0
commit 2a34e9d547
47 changed files with 944 additions and 568 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/screens/CreateSongs.js
+193
View File
@@ -0,0 +1,193 @@
import { View, Text, Image, Pressable, Platform } from "react-native";
import React, { useState } from "react";
import Page from "../layouts/Page";
import { ai, background, icons } from "../assets";
import { Palette, Style } from "../styles";
import { responsiveHeight } from "react-native-responsive-dimensions";
import BorderGradient from "../components/BorderGradient/BorderGradient";
import { BlurView } from "expo-blur";
import { FONT_FAMILY } from "../styles/Fonts";
import { size } from "../styles/Style";
import GradientButton from "../components/GradientButton";
import { goBack } from "../navigation/NavigationService";
const CreateSongs = () => {
const [selectedIndex, setSelectedIndex] = useState(null);
return (
<Page backgroundImg={background.homeBG} headerType="NONE">
<View style={{ flex: 1, ...Style.containerCenter }}>
<View
style={{
width: "100%",
height: responsiveHeight(60),
}}
>
<BorderGradient
gradientProps={{
colors: ["#FFFFFF00", Palette.white],
start: { x: 0, y: 0 },
end: { x: 1, y: 0.4 },
}}
style={{
borderWidth: 1,
borderRadius: 20,
height: responsiveHeight(55),
}}
>
<Image
source={ai.nathalie}
style={{
width: 171,
height: 250,
position: "absolute",
zIndex: 3,
top: -100,
alignSelf: "center",
}}
resizeMode="contain"
/>
<BlurView
intensity={40}
style={{
flex: 1,
borderRadius: 20,
overflow: "hidden",
justifyContent: "flex-end",
backgroundColor: Palette.glass,
paddingHorizontal: 10,
zIndex: 1,
gap: 20,
paddingVertical: 20,
}}
experimentalBlurMethod={
Platform.OS !== "ios" ? "dimezisBlurView" : "none"
}
>
<Pressable
style={{
position: "absolute",
...Style.containerCenter,
...size({ size: 24 }),
top: 10,
left: 10,
}}
onPress={goBack}
>
<Image
source={icons.close}
style={{
...size({ size: 15 }),
}}
/>
</Pressable>
<View style={{ alignItems: "center", zIndex: 2 }}>
<Text
style={{
fontSize: 22,
color: Palette.white,
fontFamily: FONT_FAMILY.InterSemiBold,
}}
>
Atelier écriture
</Text>
<Text
style={{
fontSize: 14,
color: Palette.white,
fontFamily: FONT_FAMILY.InterRegular,
}}
>
C'est ici que je vais t'aider à écrire ta chanson.
</Text>
</View>
<View style={{ gap: 10, zIndex: 1 }}>
{Array.from({ length: 3 }).map((item, index) => (
<Pressable
key={index}
onPress={() => {
console.log("Pressed");
if (selectedIndex === index) {
setSelectedIndex(null);
} else {
setSelectedIndex(index);
}
}}
style={{ zIndex: 1 }}
>
<BlurView
tint={selectedIndex === index ? "default" : "dark"}
style={{
...Style.containerSpaceBetween,
paddingHorizontal: 12,
paddingVertical: 10,
borderRadius: 14,
backgroundColor: Palette.glass,
overflow: "hidden",
}}
experimentalBlurMethod={
Platform.OS !== "ios" ? "dimezisBlurView" : "none"
}
>
<View>
<Text
style={{
fontSize: 16,
color:
selectedIndex === index
? Palette.black
: Palette.white,
fontFamily: FONT_FAMILY.InterRegular,
}}
>
Chanson sans titre
</Text>
<Text
style={{
fontSize: 12,
color:
selectedIndex === index
? Palette.black
: Palette.white,
fontFamily: FONT_FAMILY.InterRegular,
}}
>
Modifié le 23/04
</Text>
</View>
<Pressable>
<Image
source={icons.threeDots}
style={{
...size({ size: 24 }),
transform: [{ rotateZ: "90deg" }],
}}
tintColor={
selectedIndex === index
? Palette.black
: Palette.white
}
resizeMode="contain"
/>
</Pressable>
</BlurView>
</Pressable>
))}
</View>
<GradientButton
title="Créer un texte"
containerStyle={{
width: "80%",
alignSelf: "center",
marginTop: 10,
}}
/>
</BlurView>
</BorderGradient>
</View>
</View>
</Page>
);
};
export default CreateSongs;