Добавление кнопки Войти по Сбер ID

Обновлено 30 января 2026

Для отрисовки кнопки используйте SIDButton.

Добавление кнопки Войти по Сбер ID

Добавление в xml разметке

import sid.sdk.auth.view.SIDButton

<sid.sdk.auth.view.SIDButton
    android:layout_width="match_parent"
    android:layout_height="wrap_content"/>

Кнопка автоматически устанавливает иконку Сбербанка, текст, шрифт, цвет по указанным в атрибутах значениям либо значениями по умолчанию. Высота кнопки органичена интервалом 28dp-64dp, при установке высоты, выходящей за пределы интервала, высота будет автоматически приведена в соответствующей границе. Ширина кнопки имеет минимальное значение, исходя из размеров выбранного текста, логотипа и отступов. Максимальная ширина кнопки не ограничена.

При установке ширины кнопки менее минимально допустимой величины будет выполнена попытка приведения ширины кнопки к минимально допустимой. При этом в логи будет выведена ошибка с указанием расчетного и фактического значений в dp, просьба обращать на это внимание. Найти ошибку в логах можно по тэгу SberIDButtonWidthError

Вам остается только добавить:

• параметры положения кнопки;
• отступы;

Подробную информацию о стиле кнопок вы найдете в руководстве по дизайну Сбер ID.

Пример объявления кнопки с дизайном по умолчанию (способ размещения кнопки в контейнере зависит от реализации вашей разметки)

View

<sid.sdk.auth.view.SIDButton
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="36dp"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintBottom_toBottomOf="parent"/>

Compose

Для передачи параметров используйет SIDButtonModel. Для задания настроек текста и типа кнопок, используйте ButtonText и ButtonType.

AndroidView(
    factory = { context ->
       SIDButton(
          context = context,
          sidButtonModel = SIDButtonModel(
             width = width.toIntOrNull(),
             height = height.toIntOrNull(),
             type = ButtonType.DEFAULT_TYPE,
             text = ButtonText.LOGIN,
             cornerRadius = shapes.toIntOrNull(),
             strokeColor = rgb.toArgb(),
             buttonLoader = isShowLoad
          )
       )
    },
    modifier = Modifier.wrapContentSize(),
)

Добавление через конструктор

Для передачи параметров используйет SIDButtonModel. Для задания настроек текста и типа кнопок, используйте ButtonText и ButtonType.

val sidButton = SIDButton(
    context = this,
    sidButtonModel = SIDButtonModel(
        width = 120,   // размер кнопки в dp
        height = 40, // размер кнопки в dp
        type = ButtonType.DEFAULT_TYPE, // тип кнопки, Enum класс ButtonType
        text = ButtonText.LOGIN_SHORT,  // текст кнопки, Enum класс ButtonType
        cornerRadius = 4, // скругление кнопки в dp
        strokeColor = Color.rgb(76, 76, 76), //цвет граней для белой кнопки
        buttonLoader = false // нужно ли отображать загрузку со старта
    )
)

//Далее добавляем ее в ирархию виджетов
container.addView(sberIDButton)

Управление статусом загрузки

Метод SIDButton.setLoaderState() позволяет вручную программно управлять статусом загрузки в кнопке (анимированное лого СберБанка, как в разделе Персонализация кнопки).

Это может быть полезно, если перед тем, как дать возможность пользователю нажать на кнопку, вам необходимо например сделать запрос на сервер и получить oidc-параметры для авторизации по Сбер ID. Либо уже после запуска авторизации дождаться результата ее выполнения. При ручной установке статуса загрузки кнопка перестает реагировать на нажатия, при снятии - начинает. 

Предусмотрено два варианта управления статусом:

• атрибут в xml разметке кнопки app:buttonLoader="значение_true_false". Если ваш экран подразумевает ожидание каких-либо данных при первоначальной отрисовке UI, рекомендуем пользоваться именно этим способом, выставляя в разметке значение true. Если атрибут в разметке не указан, по умолчанию значение принимается за false.

• публичный метод в классе кнопки SIDButton.setLoaderState() для управления статусом загрузки по мере необходимости из программного кода

Кастомизация кнопки

По умолчанию используется стандартный вид кнопки:

Для изменения стиля кнопки, укажите параметр в xml кнопки app:buttonType=ButtonType.

Значение white_type соответствует белой кнопке с серой обводкой:

Обводка

В случае установки типа кнопки white_type есть возможность переопределить значение цвета обводки для соответствия вашему дизайну, если на экране присутствует несколько однотипных  кнопок.

Для этого установите конкретный цвет через атрибут кнопки app:buttonStrokeColor="@color/..."

При установке цвета обводки для стандартной зеленой кнопки значение будет проигнорировано.

Скругление

Для изменения скругления кнопки, укажите параметр в xml кнопки app:buttonCornerRadius="значение_dp". Предопределенные значения "corner_small" и "corner_large" соответствуют 4 и 32 dp соответственно. Есть возможность указать здесь собственное значение радиуса скругления в dp.

Текст

Для изменения текста кнопки, укажите параметр в xml кнопки app:buttonText=ButtonText.

Значение по умолчанию - Войти по Сбер ID. Установка собственного текста, шрифта, цвета текста не поддерживается.

• allCaps всегда выключен (т.е. текст не будет заглавными буквами);
• тексты поддерживают английскую локализацию на устройстве. При выборе локализации, отличной от русской и английской, тексты будут на русском.

• В примере кнопка с текстом "Сбер ID" отрисована с минимально допустимой шириной