add ios app

2026-01-31 21:20:50 +01:00
parent a170632270
commit 748f252c2f
63 changed files with 38507 additions and 0 deletions
--- a/app-ios/components/chat/ChatInput.tsx
+++ b/app-ios/components/chat/ChatInput.tsx
@@ -0,0 +1,180 @@
+import React, { useState } from 'react';
+import { 
+  View, 
+  TextInput, 
+  TouchableOpacity, 
+  StyleSheet,
+  Platform,
+  KeyboardAvoidingView,
+} from 'react-native';
+import { Ionicons } from '@expo/vector-icons';
+import { AppColors } from '@/constants/theme';
+
+interface ChatInputProps {
+  onSendMessage: (text: string) => void;
+  onVoicePress?: () => void;
+  onEmojiPress?: () => void;
+  onMorePress?: () => void;
+}
+
+export function ChatInput({ 
+  onSendMessage, 
+  onVoicePress, 
+  onEmojiPress, 
+  onMorePress 
+}: ChatInputProps) {
+  const [text, setText] = useState('');
+  const [isVoiceMode, setIsVoiceMode] = useState(false);
+
+  const handleSend = () => {
+    if (text.trim()) {
+      onSendMessage(text.trim());
+      setText('');
+    }
+  };
+
+  const toggleVoiceMode = () => {
+    setIsVoiceMode(!isVoiceMode);
+  };
+
+  return (
+    <KeyboardAvoidingView
+      behavior={Platform.OS === 'ios' ? 'padding' : undefined}
+      keyboardVerticalOffset={0}
+    >
+      <View style={styles.container}>
+        <View style={styles.inputRow}>
+          {/* Voice/Keyboard Toggle */}
+          <TouchableOpacity 
+            style={styles.iconButton} 
+            onPress={toggleVoiceMode}
+            activeOpacity={0.7}
+          >
+            <Ionicons 
+              name={isVoiceMode ? 'keypad-outline' : 'mic-outline'} 
+              size={26} 
+              color={AppColors.slatePurple} 
+            />
+          </TouchableOpacity>
+
+          {/* Text Input or Voice Button */}
+          {isVoiceMode ? (
+            <TouchableOpacity 
+              style={styles.voiceButton}
+              onPress={onVoicePress}
+              activeOpacity={0.7}
+            >
+              <Ionicons name="mic" size={20} color={AppColors.slatePurple} />
+            </TouchableOpacity>
+          ) : (
+            <TextInput
+              style={styles.textInput}
+              placeholder="说点什么..."
+              placeholderTextColor={AppColors.slatePurple}
+              value={text}
+              onChangeText={setText}
+              multiline
+              maxLength={1000}
+              returnKeyType="send"
+              onSubmitEditing={handleSend}
+              blurOnSubmit={false}
+            />
+          )}
+
+          {/* Emoji Button */}
+          <TouchableOpacity 
+            style={styles.iconButton} 
+            onPress={onEmojiPress}
+            activeOpacity={0.7}
+          >
+            <Ionicons 
+              name="happy-outline" 
+              size={26} 
+              color={AppColors.slatePurple} 
+            />
+          </TouchableOpacity>
+
+          {/* More Options / Send Button */}
+          {text.trim() ? (
+            <TouchableOpacity 
+              style={styles.sendButton} 
+              onPress={handleSend}
+              activeOpacity={0.8}
+            >
+              <Ionicons name="send" size={20} color={AppColors.white} />
+            </TouchableOpacity>
+          ) : (
+            <TouchableOpacity 
+              style={styles.iconButton} 
+              onPress={onMorePress}
+              activeOpacity={0.7}
+            >
+              <Ionicons 
+                name="add-circle-outline" 
+                size={26} 
+                color={AppColors.slatePurple} 
+              />
+            </TouchableOpacity>
+          )}
+        </View>
+      </View>
+    </KeyboardAvoidingView>
+  );
+}
+
+const styles = StyleSheet.create({
+  container: {
+    backgroundColor: AppColors.white,
+    borderTopWidth: 1,
+    borderTopColor: 'rgba(32, 0, 40, 0.08)',
+    paddingHorizontal: 14,
+    paddingTop: 10,
+    paddingBottom: Platform.OS === 'ios' ? 34 : 10,
+  },
+  inputRow: {
+    flexDirection: 'row',
+    alignItems: 'flex-end',
+    gap: 8,
+  },
+  iconButton: {
+    width: 40,
+    height: 40,
+    borderRadius: 12,
+    alignItems: 'center',
+    justifyContent: 'center',
+  },
+  textInput: {
+    flex: 1,
+    minHeight: 40,
+    maxHeight: 100,
+    paddingHorizontal: 16,
+    paddingVertical: 10,
+    backgroundColor: AppColors.cream,
+    borderRadius: 20,
+    fontSize: 16,
+    color: AppColors.deepPurple,
+    lineHeight: 20,
+  },
+  voiceButton: {
+    flex: 1,
+    height: 40,
+    backgroundColor: AppColors.cream,
+    borderRadius: 20,
+    alignItems: 'center',
+    justifyContent: 'center',
+    flexDirection: 'row',
+  },
+  sendButton: {
+    width: 40,
+    height: 40,
+    borderRadius: 12,
+    backgroundColor: AppColors.mediumPurple,
+    alignItems: 'center',
+    justifyContent: 'center',
+    shadowColor: AppColors.mediumPurple,
+    shadowOffset: { width: 0, height: 2 },
+    shadowOpacity: 0.3,
+    shadowRadius: 8,
+    elevation: 3,
+  },
+});