rocky/OSGKeyboard
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(translation-ui): tighten settings/onboarding UX around the translation feature

Browse Source 
UI refinements on top of the translation pipeline (feature/translation@HEAD):

1. Onboarding engine page now hosts a translation row.
   APISetupPage renders the same TranslationPickerRow used in the
   language tab, so first-time users can pick a target language
   before they ever see the keyboard. Same persisted bindings; same
   'needs cloud' hint when the local engine is active.

2. Local engine hides the provider / API card unconditionally.
   Removed the 'local + cloud polish on → show API fields' branch
   from SettingsView. Provider/base URL/API key/model controls have
   no use in local mode (translation is cloud-only anyway), and
   exposing them invited users to fill in a DeepSeek key they
   can't use.

3. 'Cloud polish after ASR' toggle loses its long subtitle.
   The descriptive copy in LocalEngineSettingsRows.cloudPolishRow
   was a wall of text that explained things visible elsewhere in
   Settings. Title + switch is enough; the CloudPolishDisclosureBanner
   (rendered by EnginePickerSection when cloud is active) already
   covers the 'this sends text to your API' disclosure.

4. Translation row becomes a single dropdown with a 'Don't
   translate' default.
   TranslationPickerRow replaced with a one-row Menu picker:
   '不翻译 / English / 中文 (简体) / 中文 (繁體) / 日本語 / 한국어 /
   Français / Deutsch / Español / Русский / Português'.
   '不翻译' maps to translationEnabled=false; any locale maps to
   translationEnabled=true + translationTargetLocaleId=<id>.
   TranslationLanguageCatalog gains an 'off' sentinel so the picker's
   single binding stays a plain String.

5. Language tab reorder.
   SettingsView.languageAndModelsSection: ASR locale ('识别语言')
   now sits above the local-models block; translation row sits at
   the bottom. The reading order follows the pipeline direction
   (input → post-processing → post-post-processing).

Localization:
  - 'settings.translation.title' → '翻译' / 'Translation'
  - new 'settings.translation.off' / 'settings.translation.hint.needsCloud'
  - dropped unused subtitle / target-language keys

xcodebuild scheme=OSGKeyboard config=Debug destination=iPhone 17
Simulator: BUILD SUCCEEDED (0 warning, 0 error).
This commit is contained in:
zhongshu
2026-06-25 13:23:54 +08:00
parent deddb49d56
commit 4d92999347
7 changed files with 156 additions and 117 deletions
Download Patch File Download Diff File Expand all files Collapse all files
OSGKeyboard/Views/LocalEngineSettingsRows.swift
+12 -16
View File
@@ -57,25 +57,21 @@ struct LocalModelsGroup: View {
/// itself is always live (the user can flip it without having a
/// key yet), but the polish call short-circuits with an Alert if
/// the Keychain is empty when it fires.
///
/// v0.2.1: dropped the long descriptive subtitle — it explained
/// things the user could read about elsewhere in Settings
/// (provider / API key section) and made the row visually heavy.
/// Title + switch is enough; details live in `CloudPolishDisclosureBanner`.
private var cloudPolishRow: some View {
VStack(alignment: .leading, spacing: Spacing.xs) {
Toggle(isOn: $config.localModeCloudPolishEnabled) {
VStack(alignment: .leading, spacing: 2) {
Text("settings.localModels.cloudPolish.title")
.font(TypeStyle.body)
.foregroundStyle(palette.textPrimary)
Text("settings.localModels.cloudPolish.subtitle")
.font(TypeStyle.caption2)
.foregroundStyle(palette.textTertiary)
.fixedSize(horizontal: false, vertical: true)
}
}
.toggleStyle(.switch)
.tint(palette.accent)
Toggle(isOn: $config.localModeCloudPolishEnabled) {
Text("settings.localModels.cloudPolish.title")
.font(TypeStyle.body)
.foregroundStyle(palette.textPrimary)
}
.toggleStyle(.switch)
.tint(palette.accent)
.padding(.horizontal, Spacing.md)
.padding(.vertical, Spacing.sm)
.frame(minHeight: SettingsListMetrics.doubleLineMinHeight)
.frame(minHeight: SettingsListMetrics.singleLineMinHeight)
}
// MARK: Helpers
OSGKeyboard/Views/OnboardingView.swift
+28
View File
@@ -756,8 +756,36 @@ private struct APISetupPage: View {
}
.padding(.horizontal, Spacing.lg)
}
// v0.2.1: translation row lives on the onboarding engine
// page so first-time users can pick a target language
// before they ever see the keyboard. We render the same
// `TranslationPickerRow` used in the language tab — same
// persisted bindings, same "需云端" hint when local is
// active — wrapped in the section's surface card so it
// sits flush with the engine / provider cards above.
translationSection
.padding(.horizontal, Spacing.lg)
}
.padding(.bottom, Spacing.xxxl)
}
}
private var translationSection: some View {
VStack(alignment: .leading, spacing: SettingsListMetrics.sectionLabelSpacing) {
Text("settings.translation.title")
.font(TypeStyle.caption2)
.foregroundStyle(palette.textSecondary)
.textCase(.uppercase)
.frame(maxWidth: .infinity, alignment: .leading)
VStack(spacing: 0) {
TranslationPickerRow(config: config)
}
.background(palette.surface, in: RoundedRectangle(cornerRadius: Radius.large, style: .continuous))
.overlay(
RoundedRectangle(cornerRadius: Radius.large, style: .continuous)
.stroke(palette.divider, lineWidth: 0.5)
)
}
}
}
OSGKeyboard/Views/SettingsView.swift
+17 -17
View File
@@ -62,17 +62,16 @@ struct SettingsView: View {
VStack(spacing: Spacing.md) {
appLanguageSection
engineSection
// v0.2.1: hide provider/api card when the
// local engine is active regardless of the
// cloud-polish toggle. Local mode is
// contractually ASR-only, so provider/model/
// base URL/API key controls have no use —
// and exposing them invites the user to fill
// out a DeepSeek key they can't use.
if config.engineMode == "cloud" {
providerSection
apiSection
} else if config.localModeCloudPolishEnabled {
// v0.2.0: local engine + cloud polish on.
// Surface the provider / API key fields so
// the user can fill in their DeepSeek key.
// We hide them when the toggle is off so the
// local engine stays genuinely local.
providerSection
apiSection
}
languageAndModelsSection
if config.engineMode == "cloud" {
@@ -128,10 +127,12 @@ struct SettingsView: View {
VStack(alignment: .leading, spacing: SettingsListMetrics.sectionLabelSpacing) {
sectionHeader("settings.language.title")
VStack(spacing: 0) {
if config.engineMode == "local" {
LocalModelsGroup(config: config)
Divider().background(palette.divider)
}
// v0.2.1: language tab reorder — ASR locale ("识别语言")
// now sits above the cloud-polish toggle / local models
// block so the row that maps to microphone input comes
// first, the row that maps to post-processing comes
// second, and translation (post-post-processing) sits at
// the bottom.
LocalePickerRow(
locales: effectiveLocales,
selection: Binding(
@@ -139,11 +140,10 @@ struct SettingsView: View {
set: { config.localeId = $0 }
)
)
// v0.2.1: translation toggle + target-language picker.
// Sits at the bottom of the language section so the user
// finds it next to the ASR locale it complements. Reuses
// `config.translationEnabled` / `config.translationTargetLocaleId`
// bindings — no new state, no new persistence path.
if config.engineMode == "local" {
Divider().background(palette.divider)
LocalModelsGroup(config: config)
}
Divider().background(palette.divider)
TranslationPickerRow(config: config)
}
OSGKeyboard/Views/TranslationPickerRow.swift
+68 -70
View File
@@ -1,22 +1,23 @@
// TranslationPickerRow.swift
// OSGKeyboard · Main App
//
// List row that hosts the translation toggle + target-language picker.
// Lives at the bottom of the language tab in Settings (see
// `SettingsView.languageAndModelsSection`) so it sits right next to
// the existing ASR locale picker — same picker family, same row
// metrics.
// Single-row "翻译" picker — replaces the previous two-row toggle +
// target-locale dropdown. Lets the user pick "不翻译" (off, the
// default) or one of the 10 target languages, all from a single
// `Menu`.
//
// Layout:
// • First row → switch (label on the left, switch on the right)
// • When on → a second row with a Menu picker for the target
// language. Disabled when the local engine is active so the user
// immediately sees why the picker is greyed out (instead of picking
// a target that the pipeline silently ignores).
// Mapping to persisted state:
// • "不翻译" → translationEnabled = false
// • any specific locale → translationEnabled = true, translationTargetLocaleId = <id>
//
// Reuses the host app's `ProviderConfig` `translationEnabled` /
// `translationTargetLocaleId` bindings — no new state, no new
// persistence path.
// The local engine constraint ("translation is cloud-only") is handled
// in two places that read this row:
// • The picker greys out specific locales (and prepends a "需云端"
// hint) when `config.isLocalEngine` — the user can still pick
// something but it won't fire end-to-end until they switch engines.
// • The pipeline (`PolishingService`) rejects `.translate` on local
// engine with `translationNotAvailable`, which `KeyboardViewController`
// surfaces as a 2.4s toast. Belt + suspenders.
import SwiftUI
import OSGKeyboardShared
@@ -26,90 +27,87 @@ struct TranslationPickerRow: View {
@ObservedObject var config: ProviderConfig
var body: some View {
VStack(spacing: 0) {
toggleRow
if config.translationEnabled {
Divider().background(palette.divider)
targetRow
}
}
}
private var toggleRow: some View {
HStack {
VStack(alignment: .leading, spacing: 2) {
Text("settings.translation.title")
.font(TypeStyle.body)
.foregroundStyle(palette.textPrimary)
Text(subtitleKey)
.font(TypeStyle.caption2)
.foregroundStyle(palette.textSecondary)
}
Spacer()
Toggle(
"",
isOn: Binding(
get: { config.translationEnabled },
set: { config.translationEnabled = $0 }
)
)
.labelsHidden()
.tint(palette.accent)
}
.padding(.horizontal, Spacing.md)
.frame(minHeight: SettingsListMetrics.singleLineMinHeight)
}
/// Subtitle explains why the toggle is functionally inert when the
/// local engine is on. We still let the user flip the toggle in
/// that case so their preference is saved — the moment they switch
/// back to cloud, translation just works.
private var subtitleKey: LocalizedStringKey {
config.isLocalEngine
? "settings.translation.subtitle.needsCloud"
: "settings.translation.subtitle"
}
private var targetRow: some View {
HStack {
Text("settings.translation.target")
Text("settings.translation.title")
.font(TypeStyle.body)
.foregroundStyle(palette.textPrimary)
Spacer()
Menu {
ForEach(TranslationLanguageCatalog.all) { language in
Button {
config.translationTargetLocaleId = language.id
apply(language)
} label: {
if language.id == config.translationTargetLocaleId {
Label(language.nativeName, systemImage: "checkmark")
if currentSelectionId == language.id {
Label(displayLabel(for: language), systemImage: "checkmark")
} else {
Text(language.nativeName)
Text(displayLabel(for: language))
}
}
}
} label: {
HStack(spacing: 6) {
Text(currentTargetName)
Text(currentLabel)
.font(TypeStyle.body)
.foregroundStyle(pickerForeground)
if config.isLocalEngine && !currentIsOff {
// Inline hint so the user knows the picker
// selection is being held but won't fire on the
// local engine.
Text("settings.translation.hint.needsCloud")
.font(TypeStyle.caption2)
.foregroundStyle(palette.warning)
}
Image(systemName: "chevron.up.chevron.down")
.font(.system(size: 11, weight: .bold))
.foregroundStyle(palette.textTertiary)
}
}
.disabled(config.isLocalEngine)
.opacity(config.isLocalEngine ? 0.5 : 1.0)
}
.padding(.horizontal, Spacing.md)
.frame(minHeight: SettingsListMetrics.singleLineMinHeight)
}
private var currentTargetName: String {
TranslationLanguageCatalog.resolve(config.translationTargetLocaleId).nativeName
// MARK: - Selection plumbing
/// Currently selected id derived from `translationEnabled`. We
/// route everything through the `translationEnabled` boolean so the
/// picker stays in lock-step with the rest of the system (chip,
/// pipeline, `isTranslationEffective`).
private var currentSelectionId: String {
config.translationEnabled
? config.translationTargetLocaleId
: TranslationLanguageCatalog.offLocaleId
}
private var currentLabel: String {
displayLabel(for: TranslationLanguageCatalog.resolve(currentSelectionId))
}
private var currentIsOff: Bool {
TranslationLanguageCatalog.isOff(currentSelectionId)
}
private func displayLabel(for language: TranslationLanguage) -> String {
if language.id == TranslationLanguageCatalog.offLocaleId {
return AppL10n.string("settings.translation.off")
}
return language.nativeName
}
private var pickerForeground: Color {
config.isLocalEngine ? palette.textTertiary : palette.textSecondary
currentIsOff ? palette.textSecondary : palette.textPrimary
}
/// Translates a picker choice into the underlying
/// `translationEnabled` + `translationTargetLocaleId` pair. Picking
/// "不翻译" clears the toggle; any locale flips it on and stores
/// the id.
private func apply(_ language: TranslationLanguage) {
if language.id == TranslationLanguageCatalog.offLocaleId {
config.translationEnabled = false
return
}
config.translationEnabled = true
config.translationTargetLocaleId = language.id
}
}
OSGKeyboard/en.lproj/Localizable.strings
+3 -4
View File
@@ -109,10 +109,9 @@
"settings.api.title" = "API";
"settings.language.title" = "Language";
// v0.2.1: translation feature
"settings.translation.title" = "Translate after dictation";
"settings.translation.subtitle" = "Send the transcript to your LLM with a translate-and-polish prompt before inserting.";
"settings.translation.subtitle.needsCloud" = "Requires the cloud engine — currently disabled.";
"settings.translation.target" = "Target language";
"settings.translation.title" = "Translation";
"settings.translation.off" = "Don't translate";
"settings.translation.hint.needsCloud" = "Needs cloud";
"settings.languageModels.title" = "Language & models";
"settings.localModels.title" = "On-device models";
"settings.localModels.speechRole" = "Speech";
OSGKeyboard/zh-Hans.lproj/Localizable.strings
+3 -4
View File
@@ -109,10 +109,9 @@
"settings.api.title" = "接口";
"settings.language.title" = "语言";
// v0.2.1: 翻译功能
"settings.translation.title" = "语音转文字后翻译";
"settings.translation.subtitle" = "将转写文本发送给已配置的 LLM，使用翻译+润色 prompt 处理后插入。";
"settings.translation.subtitle.needsCloud" = "需开启云端引擎，当前为本地模式暂不生效。";
"settings.translation.target" = "目标语言";
"settings.translation.title" = "翻译";
"settings.translation.off" = "不翻译";
"settings.translation.hint.needsCloud" = "需云端";
"settings.languageModels.title" = "语言与模型";
"settings.localModels.title" = "本地模型";
"settings.localModels.speechRole" = "语音识别";