adaptive keyboard height

eagleoflqj · eagleoflqj · commit 9f1bcc9b9773 · 2025-09-07T16:45:12.000-04:00
diff --git a/docs/size.md b/docs/size.md
@@ -0,0 +1,17 @@
+# Default keyboard size
+
+Simulator|Screen height|Screen width|Portrait height|Landscape height|Floating height
+-|-|-|-|-|-
+iPhone 16e|844|390|260|198|-
+iPhone 16|852|393|260|198|-
+iPhone 16 Pro|874|402|260|198|-
+iPhone 16 Plus|932|430|270|198|-
+iPhone 16 Pro Max|956|440|270|198|-
+iPad mini (A17 Pro)|1133|744|260|348|255
+iPad (A16)|1180|820|255|342|255
+iPad Air 11-inch (M3)|1180|820|255|342|255
+iPad Pro 11-inch (M4)|1210|834|260|348|255
+iPad Air 13-inch (M3)|1366|1024|325|420|260*
+iPad Pro 13-inch (M4)|1376|1032|325|420|255
+
+\* Context menu mask shows that there is no padding top, which may not be the case for real device, so use 255 to unify.
diff --git a/keyboard/KeyboardViewController.swift b/keyboard/KeyboardViewController.swift
@@ -54,7 +54,8 @@ class KeyboardViewController: UIInputViewController, FcitxProtocol {
     setLocale(syncLocale())
     startFcitx(appBundlePath, "\(Bundle.main.bundlePath)/share", appGroup.path)
 
-    hostingController = UIHostingController(rootView: virtualKeyboardView)
+    // Must recreate SwiftUI view, otherwise rotating may have old height which can't be updated.
+    hostingController = UIHostingController(rootView: newVirtualKeyboardView())
     hostingController.view.translatesAutoresizingMaskIntoConstraints = false
 
     // Spotlight shows that system keyboard has transparent background.
diff --git a/uipanel/CMakeLists.txt b/uipanel/CMakeLists.txt
@@ -17,6 +17,7 @@ add_library(KeyboardUI STATIC
     Symbol.swift
     ReturnBar.swift
     ui.swift
+    height.swift
 )
 set_target_properties(KeyboardUI PROPERTIES Swift_MODULE_NAME KeyboardUI)
 target_compile_options(KeyboardUI PUBLIC "$<$<COMPILE_LANGUAGE:Swift>:-cxx-interoperability-mode=default>")
diff --git a/uipanel/CandidateBar.swift b/uipanel/CandidateBar.swift
@@ -30,6 +30,8 @@ private func preeditWithCaret(_ preedit: String, _ caret: Int) -> String {
 
 struct CandidateBarView: View {
   @Environment(\.colorScheme) var colorScheme
+  @Environment(\.totalHeight) var totalHeight
+
   let width: CGFloat
   let auxUp: String
   let preedit: String
@@ -54,6 +56,9 @@ struct CandidateBarView: View {
   }
 
   var body: some View {
+    let barHeight = getBarHeight(totalHeight)
+    let keyboardHeight = getKeyboardHeight(totalHeight)
+
     ScrollViewReader { proxy in
       HStack(spacing: 0) {
         let barHeightExcludePreedit =
diff --git a/uipanel/Edit.swift b/uipanel/Edit.swift
@@ -5,11 +5,14 @@ let editKeyGap: CGFloat = 8
 
 struct EditView: View {
   @Environment(\.colorScheme) var colorScheme
+  @Environment(\.totalHeight) var totalHeight
   let totalWidth: CGFloat
 
   var body: some View {
+    let keyboardHeight = getKeyboardHeight(totalHeight)
     let height = keyboardHeight / 4
     let width = totalWidth / 4
+
     VStack(spacing: 0) {
       ReturnBarView()
 
@@ -91,7 +94,7 @@ struct EditView: View {
       normal ? getFunctionBackground(colorScheme) : getNormalBackground(colorScheme)
     let foreground = getNormalForeground(colorScheme)
     let p = position(index, width, height)
-    let size = keyboardHeight / shrink
+    let size = getKeyboardHeight(totalHeight) / shrink
     let useWidth = image == "arrowtriangle.up.fill" || image == "arrowtriangle.down.fill"
     let symbol = Image(systemName: image)
       .resizable()
diff --git a/uipanel/Key.swift b/uipanel/Key.swift
@@ -144,6 +144,8 @@ struct BackspaceView: View {
 
 struct GlobeView: View {
   @Environment(\.colorScheme) var colorScheme
+  @Environment(\.totalHeight) var totalHeight
+
   let x: CGFloat
   let y: CGFloat
   let width: CGFloat
@@ -175,7 +177,8 @@ struct GlobeView: View {
                 })
             }
             if !items.isEmpty {
-              let frame = CGRect(x: x, y: y + barHeight, width: width, height: height)
+              let frame = CGRect(
+                x: x, y: y + getBarHeight(totalHeight), width: width, height: height)
               virtualKeyboardView.showContextMenu(frame, items)
             }
           }
diff --git a/uipanel/Keyboard.swift b/uipanel/Keyboard.swift
@@ -27,6 +27,8 @@ extension Array where Element == CGFloat {
 }
 
 struct KeyboardView: View {
+  @Environment(\.totalHeight) var totalHeight
+
   let width: CGFloat
   let layer: String
   let lock: Bool
@@ -49,7 +51,9 @@ struct KeyboardView: View {
 
   var body: some View {
     let rows = layer == "shift" ? shiftRows : defaultRows
+    let keyboardHeight = getKeyboardHeight(totalHeight)
     let height = keyboardHeight / CGFloat(rows.count)
+
     ZStack {
       ForEach(Array(rows.enumerated()), id: \.offset) { i, row in
         renderRow(row, CGFloat(i) * height, width, height)
diff --git a/uipanel/ReturnBar.swift b/uipanel/ReturnBar.swift
@@ -2,8 +2,10 @@ import SwiftUI
 
 struct ReturnBarView: View {
   @Environment(\.colorScheme) var colorScheme
+  @Environment(\.totalHeight) var totalHeight
 
   var body: some View {
+    let barHeight = getBarHeight(totalHeight)
     HStack {
       Button {
         virtualKeyboardView.popDisplayMode()
diff --git a/uipanel/StatusArea.swift b/uipanel/StatusArea.swift
@@ -46,6 +46,7 @@ private func getActionView(_ icon: String, _ desc: String) -> some View {
 }
 
 struct StatusAreaView: View {
+  @Environment(\.totalHeight) var totalHeight
   @Binding var actions: [StatusAreaAction]
 
   private let columns = [
@@ -99,7 +100,7 @@ struct StatusAreaView: View {
             }
           }
         }
-      }.frame(height: keyboardHeight)
+      }.frame(height: getKeyboardHeight(totalHeight))
     }
   }
 }
diff --git a/uipanel/Symbol.swift b/uipanel/Symbol.swift
@@ -30,6 +30,8 @@ let builtinCategories: [SymbolCategory] = [
 
 struct SymbolButton: View {
   @Environment(\.colorScheme) var colorScheme
+  @Environment(\.totalHeight) var totalHeight
+
   let symbol: String
   let action: () -> Void
 
@@ -39,7 +41,7 @@ struct SymbolButton: View {
   var body: some View {
     Text(symbol)
       .font(.system(size: 24))
-      .frame(height: keyboardHeight / 5)
+      .frame(height: getKeyboardHeight(totalHeight) / 5)
       .frame(maxWidth: .infinity)
       .background(isPressed ? getFunctionBackground(colorScheme) : Color.clear)
       // Use simultaneousGesture so that scrolling behavior is preserved.
@@ -66,6 +68,7 @@ struct SymbolButton: View {
 
 struct SymbolView: View {
   @Environment(\.colorScheme) var colorScheme
+  @Environment(\.totalHeight) var totalHeight
   let width: CGFloat
 
   @State private var selectedKey = builtinCategories.first!.key
@@ -79,7 +82,7 @@ struct SymbolView: View {
             ForEach(builtinCategories) { category in
               Text(category.key)
                 .font(.system(size: 24))
-                .frame(height: keyboardHeight / 5)
+                .frame(height: totalHeight / 5)
                 .frame(maxWidth: .infinity)
                 .background(
                   selectedKey == category.key ? getFunctionBackground(colorScheme) : Color.clear
diff --git a/uipanel/Toolbar.swift b/uipanel/Toolbar.swift
@@ -2,9 +2,12 @@ import SwiftUI
 
 struct ToolbarView: View {
   @Environment(\.colorScheme) var colorScheme
+  @Environment(\.totalHeight) var totalHeight
+
   let width: CGFloat
 
   var body: some View {
+    let barHeight = getBarHeight(totalHeight)
     HStack(spacing: width / 6) {
       Spacer()
       Button {
diff --git a/uipanel/VirtualKeyboard.swift b/uipanel/VirtualKeyboard.swift
@@ -36,6 +36,9 @@ class ViewModel: ObservableObject {
   @Published var layer = "default"
   @Published var lock = false
 
+  // XXX: In floating state for iPad simulator, switching to fcitx5 causes layout shift due to unstable width.
+  @Published var totalHeight: CGFloat = getDefaultTotalHeight()
+  @Published var totalWidth: CGFloat = UIScreen.main.bounds.width
   @Published var frame = CGRect()
   @Published var menuItems = [MenuItem]()
   @Published var showMenu = false
@@ -101,15 +104,30 @@ public struct VirtualKeyboardView: View {
           ContextMenuOverlay(
             items: viewModel.menuItems,
             frame: viewModel.frame,
-            containerSize: CGSize(width: width, height: barHeight + keyboardHeight),
+            containerSize: CGSize(width: width, height: viewModel.totalHeight),
             onDismiss: { viewModel.showMenu = false }
           )
         }
       }.onDisappear {
         // Otherwise switch to another IM and switch back, it's still there.
         viewModel.showMenu = false
+      }.onAppear {
+        updateSize(geometry.size.width)
+      }.onChange(of: geometry.size.width) { newWidth in
+        // Floating has variable width before stable.
+        updateSize(newWidth)
       }
-    }.frame(height: barHeight + keyboardHeight)
+    }.frame(height: viewModel.totalHeight)
+      .environment(\.totalHeight, viewModel.totalHeight)
+  }
+
+  private func updateSize(_ width: CGFloat) {
+    if width == 0 {  // Unstable.
+      return
+    }
+    setFloating(width)
+    viewModel.totalWidth = width
+    viewModel.totalHeight = getDefaultTotalHeight()
   }
 
   public func setDisplayMode(_ mode: DisplayMode) {
@@ -150,13 +168,13 @@ public struct VirtualKeyboardView: View {
     viewModel.hasClientPreedit = hasClientPreedit
     viewModel.batch = (viewModel.batch + 1) & 0xFFFF
     viewModel.scrollEnd = false
-    viewModel.rowItemCount = calculateLayout(candidates, keyboardWidth * 4 / 5)
+    viewModel.rowItemCount = calculateLayout(candidates, viewModel.totalWidth * 4 / 5)
     viewModel.pendingScroll = bulk ? 0 : -1
   }
 
   public func scroll(_ candidates: [String], _ end: Bool) {
     viewModel.candidates.append(contentsOf: candidates)
-    viewModel.rowItemCount = calculateLayout(viewModel.candidates, keyboardWidth * 4 / 5)
+    viewModel.rowItemCount = calculateLayout(viewModel.candidates, viewModel.totalWidth * 4 / 5)
     // Don't update batch as we don't want to reset scroll position.
     viewModel.scrollEnd = end
   }
@@ -241,4 +259,9 @@ public struct VirtualKeyboardView: View {
   }
 }
 
-public let virtualKeyboardView = VirtualKeyboardView()
+public var virtualKeyboardView: VirtualKeyboardView!
+
+public func newVirtualKeyboardView() -> VirtualKeyboardView {
+  virtualKeyboardView = VirtualKeyboardView()
+  return virtualKeyboardView
+}
diff --git a/uipanel/height.swift b/uipanel/height.swift
@@ -0,0 +1,77 @@
+import SwiftUI
+
+struct TotalHeightKey: EnvironmentKey {
+  static let defaultValue: CGFloat = 0
+}
+
+extension EnvironmentValues {
+  var totalHeight: CGFloat {
+    get { self[TotalHeightKey.self] }
+    set { self[TotalHeightKey.self] = newValue }
+  }
+}
+
+enum KeyboardState {
+  case portrait
+  case landscape
+  case floating
+}
+
+private var isFloating = false
+
+func setFloating(_ width: CGFloat) {
+  isFloating =
+    (UIScreen.main.bounds.width >= 1000 || UIScreen.main.bounds.height > 1000)
+    && width < UIScreen.main.bounds.width && width < UIScreen.main.bounds.height
+}
+
+func getKeyboardState() -> KeyboardState {
+  if isFloating {
+    return .floating
+  }
+  if UIScreen.main.bounds.width < UIScreen.main.bounds.height {
+    return .portrait
+  }
+  return .landscape
+}
+
+func getDefaultTotalHeight() -> CGFloat {
+  switch getKeyboardState() {
+  case .portrait:
+    let height = UIScreen.main.bounds.height
+    if height < 900 {
+      return 260
+    } else if height < 1000 {
+      return 270
+    } else if height < 1150 {
+      return 260
+    } else if height < 1200 {
+      return 255
+    } else if height < 1300 {
+      return 260
+    }
+    return 325
+  case .landscape:
+    let height = UIScreen.main.bounds.width
+    if height < 1000 {
+      return 198
+    } else if height < 1150 {
+      return 348
+    } else if height < 1200 {
+      return 342
+    } else if height < 1300 {
+      return 348
+    }
+    return 420
+  case .floating:
+    return 255
+  }
+}
+
+func getKeyboardHeight(_ totalHeight: CGFloat) -> CGFloat {
+  return totalHeight * 0.8
+}
+
+func getBarHeight(_ totalHeight: CGFloat) -> CGFloat {
+  return totalHeight * 0.2
+}
diff --git a/uipanel/ui.swift b/uipanel/ui.swift
@@ -1,8 +1,5 @@
 import SwiftUI
 
-let barHeight: CGFloat = 52
-let keyboardWidth: CGFloat = UIScreen.main.bounds.width
-let keyboardHeight: CGFloat = 208
 let keyCornerRadius: CGFloat = 5
 let rowGap: CGFloat = 8
 let columnGap: CGFloat = 5

Original file line number	Diff line number	Diff line change
`@@ -17,6 +17,7 @@ add_library(KeyboardUI STATIC`
`17`	`17`	`Symbol.swift`
`18`	`18`	`ReturnBar.swift`
`19`	`19`	`ui.swift`
	`20`	`+ height.swift`
`20`	`21`	`)`
`21`	`22`	`set_target_properties(KeyboardUI PROPERTIES Swift_MODULE_NAME KeyboardUI)`
`22`	`23`	`target_compile_options(KeyboardUI PUBLIC "$<$<COMPILE_LANGUAGE:Swift>:-cxx-interoperability-mode=default>")`
Original file line number	Diff line number	Diff line change
`@@ -144,6 +144,8 @@ struct BackspaceView: View {`
`144`	`144`
`145`	`145`	`struct GlobeView: View {`
`146`	`146`	`@Environment(\.colorScheme) var colorScheme`
	`147`	`+ @Environment(\.totalHeight) var totalHeight`
	`148`	`+`
`147`	`149`	`let x: CGFloat`
`148`	`150`	`let y: CGFloat`
`149`	`151`	`let width: CGFloat`
`@@ -175,7 +177,8 @@ struct GlobeView: View {`
`175`	`177`	`})`
`176`	`178`	`}`
`177`	`179`	`if !items.isEmpty {`
`178`		`- let frame = CGRect(x: x, y: y + barHeight, width: width, height: height)`
	`180`	`+ let frame = CGRect(`
	`181`	`+ x: x, y: y + getBarHeight(totalHeight), width: width, height: height)`
`179`	`182`	`virtualKeyboardView.showContextMenu(frame, items)`
`180`	`183`	`}`
`181`	`184`	`}`
Original file line number	Diff line number	Diff line change
`@@ -46,6 +46,7 @@ private func getActionView(_ icon: String, _ desc: String) -> some View {`
`46`	`46`	`}`
`47`	`47`
`48`	`48`	`struct StatusAreaView: View {`
	`49`	`+ @Environment(\.totalHeight) var totalHeight`
`49`	`50`	`@Binding var actions: [StatusAreaAction]`
`50`	`51`
`51`	`52`	`private let columns = [`
`@@ -99,7 +100,7 @@ struct StatusAreaView: View {`
`99`	`100`	`}`
`100`	`101`	`}`
`101`	`102`	`}`
`102`		`- }.frame(height: keyboardHeight)`
	`103`	`+ }.frame(height: getKeyboardHeight(totalHeight))`
`103`	`104`	`}`
`104`	`105`	`}`
`105`	`106`	`}`