Ma/OrionTV
1
0
Fork 0
mirror of https://github.com/zimplexing/OrionTV.git synced 2026-03-07 03:07:29 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: search input focus issue

Browse Source
This commit is contained in:
zimplexing
2025-07-25 16:00:11 +08:00
parent 5992a89db4
commit 62c03beb5e
1 changed files with 29 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
app/search.tsx
View File

@@ -1,5 +1,5 @@
import React, { useState, useRef, useEffect } from "react"; import React, { useState, useRef, useEffect } from "react";
import { View, TextInput, StyleSheet, Alert, Keyboard, ActivityIndicator } from "react-native"; import { View, TextInput, StyleSheet, Alert, Keyboard, TouchableOpacity, Pressable } from "react-native";
import { ThemedView } from "@/components/ThemedView"; import { ThemedView } from "@/components/ThemedView";
import { ThemedText } from "@/components/ThemedText"; import { ThemedText } from "@/components/ThemedText";
import VideoCard from "@/components/VideoCard.tv"; import VideoCard from "@/components/VideoCard.tv";
@@ -36,13 +36,13 @@ export default function SearchScreen() {
// eslint-disable-next-line react-hooks/exhaustive-deps // eslint-disable-next-line react-hooks/exhaustive-deps
}, [lastMessage]); }, [lastMessage]);
useEffect(() => { // useEffect(() => {
// Focus the text input when the screen loads // // Focus the text input when the screen loads
const timer = setTimeout(() => { // const timer = setTimeout(() => {
textInputRef.current?.focus(); // textInputRef.current?.focus();
}, 200); // }, 200);
return () => clearTimeout(timer); // return () => clearTimeout(timer);
}, []); // }, []);
const handleSearch = async (searchText?: string) => { const handleSearch = async (searchText?: string) => {
const term = typeof searchText === "string" ? searchText : keyword; const term = typeof searchText === "string" ? searchText : keyword;
@@ -96,25 +96,36 @@ export default function SearchScreen() {
return ( return (
<ThemedView style={styles.container}> <ThemedView style={styles.container}>
<View style={styles.searchContainer}> <View style={styles.searchContainer}>
<TextInput <TouchableOpacity
ref={textInputRef} activeOpacity={1}
style={[ style={[
styles.input, styles.input,
{ {
backgroundColor: colorScheme === "dark" ? "#2c2c2e" : "#f0f0f0", backgroundColor: colorScheme === "dark" ? "#2c2c2e" : "#f0f0f0",
color: colorScheme === "dark" ? "white" : "black",
borderColor: isInputFocused ? Colors.dark.primary : "transparent", borderColor: isInputFocused ? Colors.dark.primary : "transparent",
borderWidth: 2,
}, },
]} ]}
placeholder="搜索电影、剧集..." onPress={() => textInputRef.current?.focus()}
placeholderTextColor={colorScheme === "dark" ? "#888" : "#555"}
value={keyword}
onChangeText={setKeyword}
onFocus={() => setIsInputFocused(true)} onFocus={() => setIsInputFocused(true)}
onBlur={() => setIsInputFocused(false)} onBlur={() => setIsInputFocused(false)}
onSubmitEditing={onSearchPress} >
returnKeyType="search" <TextInput
/> ref={textInputRef}
style={[
styles.input,
{
color: colorScheme === "dark" ? "white" : "black",
},
]}
placeholder="搜索电影、剧集..."
placeholderTextColor={colorScheme === "dark" ? "#888" : "#555"}
value={keyword}
onChangeText={setKeyword}
onSubmitEditing={onSearchPress}
returnKeyType="search"
/>
</TouchableOpacity>
<StyledButton style={styles.searchButton} onPress={onSearchPress}> <StyledButton style={styles.searchButton} onPress={onSearchPress}>
<Search size={24} color={colorScheme === "dark" ? "white" : "black"} /> <Search size={24} color={colorScheme === "dark" ? "white" : "black"} />
</StyledButton> </StyledButton>