如何移除Android Material Slider组件周围的默认空白间距

Material 组件库默认给 Slider 添加了触摸目标拓展间距，用来保证滑块的可点击区域符合无障碍标准，这部分间距不受 minHeight/minWidth 属性控制，可按照你使用的实现方案选择对应处理方式：

1. 传统 View 体系（XML 引入 Slider） #

• 第一步：关闭内置触摸目标偏移，给 Slider 添加属性 app:touchTargetEnabled="false"
  关闭后如果滑块可点击区域过小不符合无障碍要求，可以手动给外层布局加 padding，不会产生多余空白
• 第二步：调整轨道边距属性清除残留间距：app:trackSidePadding="0dp"
  这个属性控制轨道两端和组件边界的间距，默认不为 0，设置为 0 即可让轨道两端对齐组件边界

示例 XML 代码：

<com.google.android.material.slider.Slider
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:touchTargetEnabled="false"
    app:trackSidePadding="0dp"
    android:valueFrom="0"
    android:valueTo="100"
    android:value="50"/>

2. Jetpack Compose 实现的 Slider #

可以通过自定义滑块和轨道的配置关闭默认的拓展间距，示例代码：

var progress by remember { mutableFloatStateOf(50f) }
val interactionSource = remember { MutableInteractionSource() }

Slider(
    value = progress,
    onValueChange = { progress = it },
    modifier = Modifier.wrapContentSize(),
    interactionSource = interactionSource,
    thumb = {
        SliderDefaults.Thumb(
            interactionSource = interactionSource,
            modifier = Modifier.size(20.dp) // 自定义滑块尺寸，无额外间距
        )
    },
    track = { sliderPositions ->
        SliderDefaults.Track(
            sliderPositions = sliderPositions,
            modifier = Modifier.fillMaxWidth() // 取消轨道两端默认内边距
        )
    }
)

如果使用的是 Material3 版本的 Slider，直接配置 thumb 和 track 的 Modifier 即可，不需要额外处理。

以上方案均不需要使用负内边距，调整后 Slider 的边界会刚好包裹滑块和轨道的实际显示区域。如果需要保留无障碍触摸区域，可在 Slider 外层嵌套一个布局手动添加 padding，这部分 padding 完全可控，不会产生多余的不可控空白。

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