Как убрать отступ с текстовой кнопки?

Question

Я пытаюсь удалить прокладку из TextButton но это не сработает.

      TextButton(
    onClick = {},
    modifier = Modifier.padding(0.dp)
) {
    Text(
        " ${getString(R.string.terms_and_conditions)}",
        color = MaterialTheme.colors.primary,
        fontFamily = FontFamily(Font(R.font.poppins_regular)),
        fontSize = 10.sp,
    )
}

Я пробовал установить height а также size в Modifier свойство тоже, но отступы все еще присутствуют

Answer 1

Вы не можете уменьшить отступ с помощью paddingмодификатор: tt всегда добавляет дополнительный отступ поверх существующего. См. Этот ответ для получения более подробной информации о порядке модификаторов.

Вы можете уменьшить отступ с помощью contentPadding аргумент, указав PaddingValues(0.dp), но это не удалит заполнение полностью.

Если вам нужно полностью удалить набивку, вы можете использовать clickable модификатор вместо:

      Text(
    "getString(R.string.terms_and_conditions",
    color = MaterialTheme.colors.primary,
    fontFamily = FontFamily(Font(R.font.neris_semi_bold)),
    fontSize = 10.sp,
    modifier = Modifier
        .clickable {
            // onClick()
        }
)

Если вы хотите изменить цвет ряби, как это сделано в TextButton, вы можете сделать это следующим образом:

      .clickable(
    interactionSource = remember { MutableInteractionSource() },
    indication = rememberRipple(color = MaterialTheme.colors.primary),
) {
    
}

Answer 2

Оберните TextButtonс CompositionLocalProviderпереопределить значение LocalMinimumTouchTargetEnforcement. Это только удалит дополнительное поле, но не изменит заданный по умолчанию MinSize.

      CompositionLocalProvider(
    LocalMinimumTouchTargetEnforcement provides false,
) {
    TextButton(
        onClick = {},
        contentPadding = PaddingValues(),
    ) {
        Text(
            "Button",
            color = MaterialTheme.colors.primary,
            fontSize = 10.sp,
        )
    }
}

Answer 3

Вы можете добиться этого, изменив contentPadding и применяя фиксированный размер:

      TextButton(
    onClick = {},
    contentPadding = PaddingValues(0.dp),
    modifier = Modifier.height(20.dp).width(40.dp)
) {
    Text(
        "Button",
        color = MaterialTheme.colors.primary,
        fontSize = 10.sp,
    )
}

Answer 4

Если вы столкнетесь с нежелательными полями. Когда вы используете onclick в любой функции Button, она устанавливает propagateMinConstraints = true внутри поверхности представления — это будет применяться к нежелательным полям. Пример решения этой задачи:

      @Composable
fun ButtonWithoutOuterPadding(
    onClick: () -> Unit,
    modifier: Modifier = Modifier,
    shape: Shape = RectangleShape,
    elevation: Dp = 0.dp,
    color: Color = Color.Transparent,
    border: BorderStroke? = null,
    contentAlignment: Alignment = Alignment.Center,
    content: @Composable () -> Unit
) {
    Box(
        modifier
            .shadow(elevation, shape, clip = false)
            .then(if (border != null) Modifier.border(border, shape) else Modifier)
            .background(
                color = color,
                shape = shape
            )
            .clip(shape)
            .then(
                Modifier.clickable(
                    interactionSource = remember { MutableInteractionSource() },
                    indication = LocalIndication.current,
                    enabled = true,
                    onClickLabel = null,
                    role = null,
                    onClick = onClick
                )
            ),
        contentAlignment = contentAlignment,
        propagateMinConstraints = false
    ) {
        content()
    }
}