jrshikoku/components/発車時刻表/LED_inside_Component/Description.tsx
2024-09-16 07:41:11 +00:00

48 lines
1.2 KiB
TypeScript

import React, { FC } from "react";
import { Text, TextStyle, View, TouchableOpacity } from "react-native";
const descriptionStyle: TextStyle = {
fontSize: parseInt("16%"),
fontWeight: "bold",
};
type Props = {
info: string;
numberOfLines?: number;
onClick?: () => void;
onLongClick?: () => void;
};
export const Description:FC<Props> = ({ info, numberOfLines = 0, onClick, onLongClick }) => (
<TouchableOpacity
style={{
alignContent: "center",
alignItems: "center",
width: "94%",
marginVertical: 5,
marginHorizontal: "3%",
backgroundColor: "#000",
flexDirection: "row",
overflow: "hidden",
}}
onPress={onClick}
onLongPress={onLongClick}
>
<View style={{ flex: 4, flexDirection: "row" }}>
{numberOfLines == 1 ? (
<Text style={{ ...descriptionStyle, color: "red" }}>
&gt;{" "}
</Text>
) : (
<Text style={{ ...descriptionStyle, color: "green" }}> &gt; </Text>
)}
<Text
style={{ ...descriptionStyle, color: "green" }}
numberOfLines={numberOfLines}
>
{info}
</Text>
</View>
</TouchableOpacity>
);