Files
musicland/src/components/BlurItemButton.js
T
Philip Cesar Garay f007b1f213 Fix Task: #92
2025-09-09 18:16:30 +08:00

57 lines
1.3 KiB
JavaScript

import {
View,
Text,
Pressable,
StyleSheet,
Image,
Platform,
} from "react-native";
import React from "react";
import { BlurView } from "expo-blur";
import { Palette, Style } from "../styles";
import { FONT_FAMILY } from "../styles/Fonts";
import { icons } from "../assets";
import { size } from "../styles/Style";
const BlurItemButton = ({ onPress, title = "" }) => {
return (
<Pressable onPress={onPress}>
<BlurView
intensity={Platform.OS === "ios" ? 20 : 10}
style={styles.buttonContainer}
// experimentalBlurMethod={
// Platform.OS !== "ios" ? "dimezisBlurView" : "none"
// }
>
<Text style={styles.buttonText}>{title}</Text>
<Image
source={icons.chevronDown}
style={{
...size({ size: 15 }),
transform: [{ rotate: "-90deg" }],
}}
resizeMode="contain"
/>
</BlurView>
</Pressable>
);
};
export default BlurItemButton;
const styles = StyleSheet.create({
buttonContainer: {
...Style.containerSpaceBetween,
paddingHorizontal: 12,
height: 56,
borderRadius: 14,
overflow: "hidden",
backgroundColor: Palette.glass,
},
buttonText: {
fontSize: 16,
color: Palette.white,
fontFamily: FONT_FAMILY.InterRegular,
},
});