u

code/base-project/base-app/app.json

@@ -17,6 +17,7 @@
       "supportsTablet": true
     },
     "android": {
+      "softwareKeyboardLayoutMode": "pan",
       "adaptiveIcon": {
         "foregroundImage": "./assets/adaptive-icon.png",
         "backgroundColor": "#ffffff"

code/base-project/base-app/src/app/(tabs)/_layout.tsx

@@ -1,4 +1,5 @@
 import type { TabbarItem } from '@/components/custom/Tabbar'
+import { KeyboardProvider } from 'react-native-keyboard-controller'
 import CustomTabbar from '@/components/custom/Tabbar'
 import { toast } from '@/utils/toast'
 
@@ -42,6 +43,8 @@ export default function TabsLayout() {
   ]
 
   return (
-    <CustomTabbar data={tabbarOptions} />
+    <KeyboardProvider>
+      <CustomTabbar data={tabbarOptions} />
+    </KeyboardProvider>
   )
 }

code/base-project/base-app/src/app/(tabs)/chat.tsx

@@ -1,68 +1,64 @@
+import type {
+  TextInputProps,
+} from 'react-native'
 import React from 'react'
 import {
   StyleSheet,
-  Text,
+  TextInput as TextInputRN,
-  TextInput,
-  TouchableOpacity,
-  View,
 } from 'react-native'
-import { KeyboardAvoidingView } from 'react-native-keyboard-controller'
+import { KeyboardAwareScrollView } from 'react-native-keyboard-controller'
 
-export default function KeyboardAvoidingViewExample() {
+function TextInput(props: TextInputProps) {
   return (
-    <KeyboardAvoidingView
+    <TextInputRN
-      behavior="padding"
+      placeholderTextColor="#6c6c6c"
-      keyboardVerticalOffset={100}
+      style={styles.textInput}
-      style={styles.content}
+      multiline
+      numberOfLines={2}
+      testID={props.placeholder}
+      {...props}
+      placeholder={`${props.placeholder} (${
+        props.keyboardType === 'default' ? 'text' : 'numeric'
+      })`}
+    />
+  )
+}
+
+export default function AwareScrollView() {
+  return (
+    <KeyboardAwareScrollView
+      bottomOffset={50}
+      style={styles.container}
+      contentContainerStyle={styles.content}
     >
-      <View style={styles.inner}>
+      {Array.from({ length: 10 }).fill(0).map((_, i) => (
-        <Text style={styles.heading}>Header</Text>
+        <TextInput
-        <View>
+          key={i}
-          <TextInput placeholder="Username" style={styles.textInput} />
+          placeholder={`TextInput#${i}`}
-          <TextInput placeholder="Password" style={styles.textInput} />
+          keyboardType={i % 2 === 0 ? 'numeric' : 'default'}
-        </View>
+        />
-        <TouchableOpacity style={styles.button}>
+      ))}
-          <Text style={styles.text}>Submit</Text>
+    </KeyboardAwareScrollView>
-        </TouchableOpacity>
-      </View>
-    </KeyboardAvoidingView>
   )
 }
 
 const styles = StyleSheet.create({
+  container: {
+    paddingHorizontal: 16,
+  },
   content: {
-    flex: 1,
+    paddingTop: 50,
-    maxHeight: 600,
-  },
-  heading: {
-    fontSize: 36,
-    marginBottom: 48,
-    fontWeight: '600',
-  },
-  inner: {
-    padding: 24,
-    flex: 1,
-    justifyContent: 'space-between',
   },
   textInput: {
-    height: 45,
+    width: '100%',
-    borderColor: '#000000',
+    minHeight: 50,
-    borderWidth: 1,
+    maxHeight: 200,
+    marginBottom: 50,
+    borderColor: 'black',
+    borderWidth: 2,
+    marginRight: 160,
     borderRadius: 10,
-    marginBottom: 36,
+    color: 'black',
-    paddingLeft: 10,
+    paddingHorizontal: 12,
-  },
-  button: {
-    marginTop: 12,
-    height: 45,
-    borderRadius: 10,
-    backgroundColor: 'rgb(40, 64, 147)',
-    justifyContent: 'center',
-    alignItems: 'center',
-  },
-  text: {
-    fontWeight: '500',
-    fontSize: 16,
-    color: 'white',
   },
 })

code/base-project/base-app/src/app/(tabs)/money/components/AddDrawer.tsx

@@ -2,8 +2,7 @@ import type { MoneyCategoryResult } from '@/request/api/money'
 import type { MoneyCategory } from '@/types/money'
 import Big from 'big.js'
 import { useEffect, useRef, useState } from 'react'
-import { Keyboard, Platform, Pressable, StyleSheet, Text, TouchableWithoutFeedback, View } from 'react-native'
+import { Keyboard, KeyboardAvoidingView, Platform, Pressable, StyleSheet, Text, TouchableWithoutFeedback, View } from 'react-native'
-import { KeyboardProvider } from 'react-native-keyboard-controller'
 import { useSafeAreaInsets } from 'react-native-safe-area-context'
 import { AInput, LucideIcon } from '@/components/common/ao'
 import SegmentedTabs from '@/components/common/ao/SegmentedTabs'
@@ -367,7 +366,6 @@ export default function AddMoneyDrawer({
 
         {showKeydown && (
           <View>
-
             <TouchableWithoutFeedback onPress={Keyboard.dismiss}>
               <View className="p-4 h-28">
                 <View className="flex flex-row items-center justify-between">
@@ -382,7 +380,6 @@ export default function AddMoneyDrawer({
                 </View>
 
                 <Text className="text-gray-400 text-right">{keydownInput}</Text>
-
                 <AInput
                   ref={inputRef}
                   value={keydownInput}
@@ -392,6 +389,7 @@ export default function AddMoneyDrawer({
                   onFocus={() => setIsFocused(true)}
                   onBlur={() => setIsFocused(false)}
                 />
+
               </View>
             </TouchableWithoutFeedback>
             <View className="flex flex-row flex-wrap" style={{ height: 220 }}>
@@ -438,12 +436,12 @@ export default function AddMoneyDrawer({
               })}
             </View>
 
-            {/* {isFocused && (
+            {isFocused && (
               <View style={{ height:
                 keyboardHeight + 10 - 220 }}
               >
               </View>
-            )} */}
+            )}
           </View>
         )}
 

code/base-project/base-app/src/app/(tabs)/money/index.tsx

@@ -2,6 +2,7 @@ import type { LayoutChangeEvent } from 'react-native'
 import { LinearGradient } from 'expo-linear-gradient'
 import React, { useRef, useState } from 'react'
 import { ScrollView, Text, View } from 'react-native'
+import { KeyboardAvoidingView, KeyboardProvider } from 'react-native-keyboard-controller'
 import { useSafeAreaInsets } from 'react-native-safe-area-context'
 import { LucideIcon } from '@/components/common/ao'
 import { IconJiaotong } from '@/components/iconfont'
@@ -154,7 +155,6 @@ export default function Money() {
           setShowDrawer(false)
         }}
       />
-
     </View>
   )
 }

code/base-project/base-app/src/app/(tabs)/user.tsx

@@ -1,6 +1,6 @@
 import { router } from 'expo-router'
 import { StyleSheet, Text, View } from 'react-native'
-import { AButton } from '@/components/common/ao'
+import { AButton, AInput } from '@/components/common/ao'
 import { useUserStore } from '@/store/user'
 
 export default function User() {
@@ -49,6 +49,8 @@ export default function User() {
       >
         跳转到登陆页面
       </AButton>
+
+      <AInput value="2" />
     </View>
   )
 }

code/base-project/base-app/src/app/auth/login.tsx

@@ -96,7 +96,7 @@ export default function AuthLogin() {
         <AFormItem label="账号">
           <AInput
             value={form.account}
-            onChange={text => handleInputChange('account', text)}
+            onChangeText={text => handleInputChange('account', text)}
           />
         </AFormItem>
 
@@ -104,7 +104,7 @@ export default function AuthLogin() {
           <AInput
             isPassword
             value={form.password}
-            onChange={text => handleInputChange('password', text)}
+            onChangeText={text => handleInputChange('password', text)}
           />
         </AFormItem>
       </AForm>

code/base-project/base-app/src/app/auth/register.tsx

@@ -75,7 +75,7 @@ export default function AuthRegister() {
               placeholder="请输入账号"
               leftIcon={UserRound}
               value={form.username}
-              onChange={text => handleInputChange('username', text)}
+              onChangeText={text => handleInputChange('username', text)}
             />
           </AFormItem>
 
@@ -89,7 +89,7 @@ export default function AuthRegister() {
               leftIcon={Lock}
               isPassword
               value={form.password}
-              onChange={text => handleInputChange('password', text)}
+              onChangeText={text => handleInputChange('password', text)}
             />
           </AFormItem>
 
@@ -109,7 +109,7 @@ export default function AuthRegister() {
               leftIcon={Lock}
               isPassword
               value={form.confirmPassword}
-              onChange={text => handleInputChange('confirmPassword', text)}
+              onChangeText={text => handleInputChange('confirmPassword', text)}
             />
           </AFormItem>
         </AForm>

code/base-project/base-app/src/request/index.ts

@@ -30,8 +30,8 @@ function isWhiteListed(url: string) {
 }
 
 const alovaInstance = createAlova({
-  // baseURL: 'http://192.168.5.6:8085/app',
+  baseURL: 'http://192.168.5.6:8085/app',
-  baseURL: 'http://192.168.1.136:8085/app',
+  // baseURL: 'http://192.168.1.136:8085/app',
   requestAdapter: axiosRequestAdapter(),
   timeout: 5000,
   cacheFor: null,

notes/前端开发/react-native/expo.md

@@ -1221,9 +1221,9 @@ keytool -genkey -v -keystore android-release.keystore -alias my-key-alias -keyal
 
 ```bash
 systemProp.http.proxyHost=127.0.0.1
-systemProp.http.proxyPort=7897
+systemProp.http.proxyPort=7890
 systemProp.https.proxyHost=127.0.0.1
-systemProp.https.proxyPort=7897
+systemProp.https.proxyPort=7890
 ```
 
 打包结果在 `android/app/build/outputs/apt/release` 包下。