Jetpack Compose如何修改OutlinedTextField的标签显示方向

波斯语属于RTL（从右到左）书写体系，OutlinedTextField默认标签显示在左侧是因为当前上下文的布局方向为LTR（从左到右），可以根据需求选择以下两种实现方式：

方案1：配置RTL布局方向（官方推荐） #

该方案会自动适配所有RTL交互逻辑：除了标签自动移到边框右侧，输入光标、文字对齐、前后缀组件、清除按钮的位置都会符合波斯语用户的使用习惯，是多语言适配的标准做法。

• 全局生效：在Compose入口配置布局方向，整个App的所有组件都会自动适配RTL

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            // 全局设置RTL布局方向
            CompositionLocalProvider(LocalLayoutDirection provides LayoutDirection.Rtl) {
                YourAppTheme {
                    // 你的App根导航/页面内容
                    Surface(modifier = Modifier.fillMaxSize()) {
                        MainPage()
                    }
                }
            }
        }
    }
}

• 单组件生效：如果仅需要某一个输入框适配，直接给目标OutlinedTextField外层包裹布局方向配置即可

// 仅对这个输入框生效RTL
CompositionLocalProvider(LocalLayoutDirection provides LayoutDirection.Rtl) {
    OutlinedTextField(
        value = inputText,
        onValueChange = { inputText = it },
        label = { Text("نام کاربری") } // 波斯语标签文本
    )
}

方案2：自定义装饰盒仅调整标签位置 #

如果不想改动输入框整体的布局方向，仅需要把标签移到右侧，可以通过自定义decorationBox参数手动调整标签布局：

OutlinedTextField(
    value = inputText,
    onValueChange = { inputText = it },
    textStyle = LocalTextStyle.current.copy(textAlign = TextAlign.End), // 输入文字同步右对齐
    decorationBox = { innerTextField ->
        OutlinedTextFieldDefaults.DecorationBox(
            value = inputText,
            innerTextField = innerTextField,
            enabled = true,
            singleLine = true,
            visualTransformation = VisualTransformation.None,
            interactionSource = remember { MutableInteractionSource() },
            label = {
                // 标签对齐到容器右侧
                Box(
                    modifier = Modifier.fillMaxWidth(),
                    contentAlignment = Alignment.CenterEnd
                ) {
                    Text("عنوان فیلد")
                }
            },
            container = {
                // 保留默认的Outline边框样式
                OutlinedTextFieldDefaults.Container(
                    enabled = true,
                    isError = false,
                    interactionSource = remember { MutableInteractionSource() }
                )
            }
        )
    }
)

实现效果参考：

注意：如果使用方案2，一定要同步设置输入文字的对齐方式为右对齐，否则输入内容默认居左会和右侧标签产生视觉冲突，不符合波斯语阅读习惯。优先选择方案1做RTL适配，避免遗漏其他交互细节。

内容的提问来源于stack exchange，提问作者Saeed Noshadi