ly0303521

将视频预览区修改成尾帧

... ... @@ -30,6 +30,10 @@ const HistoryBar: React.FC<HistoryBarProps> = ({ images, onSelect }) => {
muted
playsInline
preload="metadata"
onLoadedMetadata={(e) => {
const video = e.target as HTMLVideoElement;
video.currentTime = video.duration || 0;
}}
/>
) : (
<img
... ...
... ... @@ -22,6 +22,7 @@ const ImageCard: React.FC<ImageCardProps> = ({ image, onClick, onLike, currentUs
const handleMouseEnter = () => {
if (videoRef.current) {
videoRef.current.currentTime = 0;
videoRef.current.play().catch(e => console.error("Video play failed", e));
}
}
... ... @@ -29,6 +30,13 @@ const ImageCard: React.FC<ImageCardProps> = ({ image, onClick, onLike, currentUs
const handleMouseLeave = () => {
if (videoRef.current) {
videoRef.current.pause();
videoRef.current.currentTime = videoRef.current.duration || 0;
}
}
const handleVideoMetadata = () => {
if (videoRef.current) {
videoRef.current.currentTime = videoRef.current.duration || 0;
}
}
... ... @@ -50,6 +58,7 @@ const ImageCard: React.FC<ImageCardProps> = ({ image, onClick, onLike, currentUs
ref={videoRef}
src={image.url}
className={`w-full h-auto object-cover transition-opacity duration-300 ${isLoaded ? 'opacity-100' : 'opacity-0'}`}
onLoadedMetadata={handleVideoMetadata}
onLoadedData={() => setIsLoaded(true)}
loop
muted
... ...