Kivy如何消除TextInput控件的奇怪默认阴影效果？

我已为TextInput设置了自定义颜色，但未点击该控件时，它仍会呈现顶部黑灰色、底部白色的奇怪阴影效果。我尝试调整foreground_color和background_color均没有作用，请问该如何解决该问题？

问题原因 #

你看到的分层阴影是TextInput控件默认自带的背景装饰样式，不属于foreground_color（前景/文字色）或background_color（纯色背景）的控制范围，因此调整这两个属性无法生效。

解决方案 #

以下是不同开发框架下的修复方法：

1. Kivy 框架 #

Kivy的TextInput默认自带渐变阴影背景，需要手动覆盖background_normal、background_active两个属性清除默认样式：

• 代码中动态设置示例：

from kivy.uix.textinput import TextInput

custom_input = TextInput(
    # 清除默认阴影背景
    background_normal = '',
    background_active = '',
    # 在此处设置自定义背景色
    background_color = (1, 1, 1, 1)
)

• Kv语言编写示例：

TextInput:
    background_normal: ''
    background_active: ''
    background_color: 1, 1, 1, 1 # 替换为你需要的颜色值

2. Android 原生框架（TextInputEditText/EditText） #

安卓原生输入框默认自带下划线和阴影背景，直接重置背景属性即可：

• Kotlin 代码示例：

val inputView = findViewById<TextInputEditText>(R.id.your_input_id)
// 清除默认背景
inputView.background = null
// 自定义背景色
inputView.setBackgroundColor(Color.parseColor("#FFFFFF"))

• XML 布局示例：

<androidx.appcompat.widget.AppCompatEditText
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@null"
    android:backgroundTint="@color/your_custom_color" />

3. Flutter 框架（TextField） #

Flutter输入框的默认阴影属于装饰属性范围，修改decoration配置即可清除：

TextField(
  decoration: InputDecoration(
    // 移除默认边框和阴影效果
    border: InputBorder.none,
    // 自定义填充背景色
    fillColor: Colors.white,
    filled: true,
  ),
)

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