会员文案修改、价格外露;动态图片上锁;删除动态时间

This commit is contained in:
yezian 2024-01-29 01:53:13 +08:00
parent dcfc81ed6f
commit 68194e2298
5 changed files with 141 additions and 53 deletions

BIN
assets/images/lock@2x.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.9 KiB

BIN
assets/images/lock@3x.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.4 KiB

View File

@ -6,7 +6,6 @@ import {
TouchableWithoutFeedback,
ActivityIndicator,
Image as NativeImage,
Platform,
} from "react-native";
import React, { useState } from "react";
import { useTailwind } from "tailwind-rn";
@ -23,6 +22,8 @@ import { get } from "../../utils/storeInfo";
const blurhash = "LcKUTa%gOYWBYRt6xuoJo~s8V@fk";
const vipBlurhash = "LhPFg0K+TZs;G^G9n5WVEen%n,WV";
export default function Post({ blur, data }) {
const tailwind = useTailwind();
const navigation = useNavigation();
@ -171,11 +172,8 @@ export default function Post({ blur, data }) {
)}
</View>
<View
style={tailwind("flex flex-row items-center justify-between h-8")}
style={tailwind("flex flex-row items-center justify-end h-8")}
>
<Text style={tailwind("text-sm font-medium text-[#FFFFFF80]")}>
{formatTimestamp(data?.ct)}
</Text>
{blur ? (
<TouchableOpacity
activeOpacity={1}
@ -244,7 +242,77 @@ function ImageDisplay({ blur, media }) {
const [isModalVisible, setIsModalVisible] = useState(false);
const [imageIndex, setImageIndex] = useState();
const images = media.map((item) => ({ url: item.urls[0] }));
if (blur) {
return (
<View style={tailwind("flex flex-row flex-wrap")}>
{media.length > 1 ? (
media.map((item, index) => (
<TouchableOpacity
activeOpacity={1}
key={index}
onPress={() =>
navigation.navigate("WebWithoutHeader", {
uri: process.env.EXPO_PUBLIC_WEB_URL + "/vip",
})
}
style={{
aspectRatio: 1,
...tailwind("basis-1/3 p-0.5 relative"),
}}
>
<Image
style={tailwind("w-full h-full rounded")}
placeholder={vipBlurhash}
contentFit="cover"
transition={1000}
cachePolicy="disk"
/>
<View
style={tailwind(
"flex absolute top-0 left-0 items-center justify-center w-full h-full"
)}
>
<NativeImage source={require("../../assets/images/lock.png")} />
</View>
</TouchableOpacity>
))
) : (
<TouchableOpacity
activeOpacity={1}
onPress={() =>
navigation.navigate("WebWithoutHeader", {
uri: process.env.EXPO_PUBLIC_WEB_URL + "/vip",
})
}
style={{
width: 200,
height: 250,
...tailwind("relative"),
}}
>
<Image
style={tailwind("w-full h-full rounded")}
placeholder={vipBlurhash}
contentFit="cover"
transition={1000}
cachePolicy="disk"
/>
<View
style={tailwind(
"flex absolute top-0 left-0 items-center justify-center w-full h-full"
)}
>
<NativeImage source={require("../../assets/images/lock.png")} />
</View>
</TouchableOpacity>
)}
</View>
);
}
if (images.length === 0) return null;
return (
<View style={tailwind("flex flex-row flex-wrap")}>
{media.length > 1 ? (
@ -252,22 +320,14 @@ function ImageDisplay({ blur, media }) {
<TouchableOpacity
activeOpacity={1}
key={index}
onPress={
blur
? () =>
navigation.navigate("WebWithoutHeader", {
uri: process.env.EXPO_PUBLIC_WEB_URL + "/vip",
})
: () => {
setIsModalVisible(true);
setImageIndex(index);
}
}
onPress={() => {
setIsModalVisible(true);
setImageIndex(index);
}}
style={{ aspectRatio: 1, ...tailwind("basis-1/3 p-0.5") }}
>
<Image
style={tailwind("w-full h-full rounded")}
blurRadius={blur ? (Platform.OS === "ios" ? 130 : 7) : 0}
source={item.urls[0]}
placeholder={blurhash}
contentFit="cover"
@ -279,17 +339,10 @@ function ImageDisplay({ blur, media }) {
) : (
<TouchableOpacity
activeOpacity={1}
onPress={
blur
? () =>
navigation.navigate("WebWithoutHeader", {
uri: process.env.EXPO_PUBLIC_WEB_URL + "/vip",
})
: () => {
setIsModalVisible(true);
setImageIndex(0);
}
}
onPress={() => {
setIsModalVisible(true);
setImageIndex(0);
}}
style={{
width:
media[0].w < media[0].h ? (media[0].w / media[0].h) * 200 : 250,
@ -299,7 +352,6 @@ function ImageDisplay({ blur, media }) {
>
<Image
style={tailwind("w-full h-full rounded")}
blurRadius={blur ? (Platform.OS === "ios" ? 130 : 7) : 0}
source={media[0].urls[0]}
placeholder={blurhash}
contentFit="contain"
@ -327,6 +379,33 @@ function ImageDisplay({ blur, media }) {
//
function PosterDisplay({ blur, media }) {
const tailwind = useTailwind();
if (blur) {
return (
<View
style={{
width: 200,
height: 250,
}}
>
<Image
style={tailwind("w-full h-full rounded")}
placeholder={vipBlurhash}
contentFit="cover"
transition={1000}
cachePolicy="disk"
/>
<View
style={tailwind(
"flex absolute w-full h-full left-0 top-0 z-10 justify-center items-center"
)}
>
<NativeImage source={require("../../assets/images/lock.png")} />
</View>
</View>
);
}
return (
<View
style={{
@ -342,7 +421,6 @@ function PosterDisplay({ blur, media }) {
>
<Image
style={tailwind("w-full h-full rounded")}
blurRadius={blur ? (Platform.OS === "ios" ? 130 : 7) : 0}
source={media.cover_urls[0]}
placeholder={blurhash}
contentFit="cover"

View File

@ -131,7 +131,13 @@ export default function FeedPosts({ blur }) {
keyExtractor={(item) => item.id}
/>
{blur && (
<View
<TouchableOpacity
activeOpacity={1}
onPress={() =>
navigation.navigate("WebWithoutHeader", {
uri: process.env.EXPO_PUBLIC_WEB_URL + "/vip",
})
}
style={tailwind(
"flex flex-row items-center justify-between h-12 bg-[#301024] px-4"
)}
@ -140,16 +146,15 @@ export default function FeedPosts({ blur }) {
<NativeImage
source={require("../../../assets/icon/others/vipbig.png")}
/>
<Text style={tailwind("text-[#FF669E] text-base font-medium ml-1")}>
开通会员订阅动态
<Text
numberOfLines={1}
ellipsizeMode="tail"
style={tailwind("text-[#FF669E] text-base font-medium ml-1")}
>
开通会员订阅全部
</Text>
</View>
<TouchableOpacity
onPress={() =>
navigation.navigate("WebWithoutHeader", {
uri: process.env.EXPO_PUBLIC_WEB_URL + "/vip",
})
}
<View
style={tailwind(
"flex justify-center items-center h-9 bg-[#FF669E] rounded-full px-4"
)}
@ -157,8 +162,8 @@ export default function FeedPosts({ blur }) {
<Text style={tailwind("text-white text-sm font-medium")}>
¥99/永久
</Text>
</TouchableOpacity>
</View>
</View>
</TouchableOpacity>
)}
</View>
);

View File

@ -166,7 +166,13 @@ export default function FollowPosts({ blur }) {
keyExtractor={(item) => item.id}
/>
{blur && (
<View
<TouchableOpacity
activeOpacity={1}
onPress={() =>
navigation.navigate("WebWithoutHeader", {
uri: process.env.EXPO_PUBLIC_WEB_URL + "/vip",
})
}
style={tailwind(
"flex flex-row items-center justify-between h-12 bg-[#301024] px-4"
)}
@ -175,25 +181,24 @@ export default function FollowPosts({ blur }) {
<NativeImage
source={require("../../../assets/icon/others/vipbig.png")}
/>
<Text style={tailwind("text-[#FF669E] text-base font-medium ml-1")}>
开通会员订阅动态
<Text
numberOfLines={1}
ellipsizeMode="tail"
style={tailwind("text-[#FF669E] text-base font-medium ml-1")}
>
开通会员订阅全部
</Text>
</View>
<TouchableOpacity
onPress={() =>
navigation.navigate("WebWithoutHeader", {
uri: process.env.EXPO_PUBLIC_WEB_URL + "/vip",
})
}
<View
style={tailwind(
"flex justify-center items-center h-9 bg-[#FF669E] rounded-full px-4"
)}
>
<Text style={tailwind("text-white text-sm font-medium")}>
点我看看
¥99/永久
</Text>
</TouchableOpacity>
</View>
</View>
</TouchableOpacity>
)}
</View>
);