В случае использования русскоязычных путей сборка отладочных HAP может завершиться ошибкой. Рекомендуется располагать проект в директориях с английскими названиями.

Интеграция

Метод 1: Создание HAR пакета через библиотеку, добавление HAR пакета в папку libs Добавьте следующий код в Gradle файл entry

implementation fileTree(dir: 'libs', include: ['*.jar', '*.har'])

Метод 2:

allprojects {
    repositories {
        mavenCentral()
    }

    implementation 'io.openharmony.tpc.thirdlib:BottomBar:1.0.2'
}

BottomBar

Что это?

Компонент пользовательского интерфейса, реализующий шаблон нижней навигационной панели.

Как использовать?

Вы можете добавлять элементы, создавая XML файл ресурсов.

Добавление элементов из XML ресурсов

Определите ваши вкладки в файле ресурсов. rawfile/xml/bottombar_tabs_three.xml:

<tabs>
    <tab
        idtag="tab0"
        icon="$media:i0"
        iconSelected="$media:i0_selected"
        title="Icon0" />
    <tab
        idtag="tab1"
        icon="$media:i1"
        iconSelected="$media:i1_selected"
        title="Icon1" />
    <tab
        idtag="tab2"
        icon="$media:i2"
        iconSelected="$media:i2_selected"
        title="Icon2" />
</tabs>

Затем добавьте BottomBar в ваш макет и назначьте ему уникальный ID для вашего XML файла вкладок. layout/ability_three_tabs.xml

<DependentLayout xmlns:ohos="http://schemas.huawei.com/res/ohos"
    xmlns:app="http://schemas.huawei.com/res-auto"
    ohos:width="match_parent"
    ohos:height="match_parent">

    <Text
        ohos:id="$+id:messageView"
        ohos:width="match_parent"
        ohos:height="match_parent"
        ohos:above="$+id:bottomBar"
        ohos:text_alignment="center"
        ohos:text="Привет мама!" />
</DependentLayout>
``````markdown
    @Override
    public void onStart(Intent intent) {
        super.onStart(intent);
        setUIContent(ResourceTable.Layout_ability_three_tabs);
        Text messageView = (Text) findComponentById(ResourceTable.Id_messageView);

        BottomBar bottomBar = (BottomBar) findComponentById(ResourceTable.Id_bottomBar);
        bottomBar.setOnTabSelectListener(new OnTabSelectListener() {
            @Override
            public void onTabSelected(String idtag) {
                if ("tab0".equals(idtag)) {
                    // Tab with idtag tab0 was selected,
                    // change your content accordingly.
                }
            }
        });
    }

Настройка слушателей событий

По умолчанию, вкладки ничего не делают, пока вы не установите прослушивание событий выбора и не выполните какие-либо действия при выборе вкладок. ThreeTabsAbility.java:

public class ThreeTabsAbility extends Ability {
```}

Чтобы слушать события повторного выбора вкладок, выполните следующее:

bottomBar.setOnTabReselectListener(new OnTabReselectListener() {
    @Override
    public void onTabReSelected(String idtag) {
        if ("tab0".equals(idtag)) {
            // Вкладка с idtag tab0 была выбрана,
            // измените ваш контент соответственно.
        }
    }
});

Интерceptar выбор вкладок

Если вы хотите условно отменять выбор любой вкладки, вы можете это сделать. Просто назначьте TabSelectionInterceptor для BottomBar и верните true из метода shouldInterceptTabSelection().

bottomBar.setTabSelectionInterceptor(new TabSelectionInterceptor() {
    @Override
    public boolean shouldInterceptTabSelection(String oldTabIdtag, String newTabIdtag) {
        if (newTabId.equals("tab0") && !userHasProVersion()) {
          startProVersionPurchaseFlow();
          return true;
        }
```        return false;
     }
 });

Эти вкладки с изменением цвета выглядят круто. Как это сделать?

Просто добавьте barColorWhenSelected к каждой вкладке. Когда эта вкладка будет выбрана, весь фон BottomBar изменится цветом с красивым анимированным эффектом. res/xml/bottombar_tabs.xml

<tabs>
	<tab
        idtag="tab0"
        icon="$media:i0"
        iconSelected="$media:i0_selected"
        title="Icon0"
		barColorWhenSelected="#5D4037"/>
    <!-- Нельзя использовать @color ресурсы! -->
</tabs>

А что насчет планшетов?

Укажите другой макет для своей возможности в папке resources/horizontal/layout и установите bb_tabletMode равным true. resources/horizontal/layout/activity_main.xml:

<DependentLayout xmlns:ohos="http://schemas.huawei.com/res/ohos"
    xmlns:app="http://schemas.huawei.com/res-auto"
    ohos:width="match_parent"
    ohos:height="match_parent">

    <Text
        ohos:id="$+id:messageView"
        ohos:width="match_parent"
        ohos:height="match_parent"
        ohos:above="$+id:bottomBar"
        ohos:text_alignment="center"
        ohos:text="Привет, мама!" />

</DependentLayout>

Все варианты кастомизации

Для BottomBar

<com.roughike.bottombar.BottomBar
	ohos:id="$+id:bottomBar"
	ohos:width="match_parent"
	ohos:height="60vp"
	ohos:align_parent_bottom="true"
	app:bb_tabXmlResource="resources/rawfile/xml/bottombar_tabs_three.xml"
	app:bb_tabletMode="false"
	app:bb_behavior="none"
	app:bb_longPressHintsEnabled="true"
	app:bb_titleTypeFace="resources/rawfile/fonts/GreatVibes-Regular.otf"
	app:bb_inActiveTabAlpha="0.6"
	app:bb_activeTabAlpha="1.0"
	app:bb_inActiveTabColor="#FFC50E"
	app:bb_activeTabColor="#FF2F17"
	app:bb_badgeBackgroundColor="#FF0000"
	app:bb_badgesHideWhenActive="true"
/>

bb_tabXmlResource: ID ресурса XML для ваших вкладок, который находится в rawfile/xml/.
bb_tabletMode: Если вы хотите, чтобы BottomBar вёл себя по-разному на планшетах.

```markdown

bb_behavior: shifting: выбранная вкладка шире остальных.
iconOnly: отображает только значки и не показывает названия.
shifting|iconOnly: режим сдвига + режим только значков.
none: значение по умолчанию.
bb_inActiveTabAlpha: Значение прозрачности для неактивных вкладок, используемое в значках и названиях вкладок.
bb_activeTabAlpha: Значение прозрачности для активных вкладок, используемое в значках и названиях вкладок.
bb_inActiveTabColor: Цвет для неактивных вкладок, используемый в значках и названиях вкладок.
bb_activeTabColor: Цвет для активных вкладок, используемый в значках и названиях вкладок.
bb_badgeBackgroundColor: Фоновый цвет для всех значков в этом BottomBar.
bb_badgesHideWhenActive: Показывает, должны ли значки скрываться для активных вкладок, значение по умолчанию — true.
bb_titleTypeFace: Путь к вашему файлу с пользовательским шрифтом, например rawfile/fonts/MySuperDuperFont.ttf.

```### Для вкладышей ```xml ```

inActiveColor: Цвет для неактивных вкладок, используемый в значках и заголовках вкладок.
activeColor: Цвет для активных вкладок, используемый в значках и заголовках вкладок.

```

barColorWhenSelected

Цвет, которым должна быть окрашена нижняя панель при выборе этой вкладки.

badgeBackgroundColor

Фоновый цвет для всех значков в этой вкладке.

badgeHidesWhenActive

Отображает, скрывается ли значок при выборе этой вкладки; по умолчанию установлено значение true.

iconOnly

Устанавливает режим iconOnly для каждой вкладки отдельно.

## Вклады Пожалуйста, создайте проблемы и запросы на слияние. Когда вы создаёте запросы на слияние, **чем больше тем лучше**: мне хотелось бы видеть десяток небольших запросов на слияние, разделённых по функциям, а не всё это объединённое в один большой.

Лицензия

Библиотека BottomBar для Android
Авторское право © 2016 Iiro Krankka (http://github.com/roughike).
Разрешено использование с лицензией Apache, версия bk 2.0 (лицензия).
Вы не можете использовать этот файл, если вы не будете следовать условиям Лицензии.
Вы можете получить копию Лицензии по адресу
http://www.apache.org/licenses/LICENSE-2.0
Если применимо законодательство или согласовано в письменной форме, программное обеспечение
распределенное по Лицензии распространяется на условиях «КАК ЕСТЬ», БЕЗ КАКИХ-ЛИБО ГАРАНТИЙ ИЛИ УСЛОВИЙ,
как явных, так и подразумевающихся.
Увидеть Лицензию для конкретного языка, регулирующего права использования и ограничения, предусмотренные Лицензией.

OSCHINA-MIRROR/HarmonyOS-tpc-BottomBar

Интеграция

BottomBar

Что это?

Как использовать?

Добавление элементов из XML ресурсов

Настройка слушателей событий

Интерceptar выбор вкладок

Эти вкладки с изменением цвета выглядят круто. Как это сделать?

А что насчет планшетов?

Все варианты кастомизации

Для BottomBar

Лицензия

Опубликовать ( 0 )

Введение

Обновления

Участники

Недавние действия

OSCHINA-MIRROR/HarmonyOS-tpc-BottomBar .gitee-modal { min-width: 500px !important; } .gitee-modal .close { right: 0.6rem !important; }

Интеграция

BottomBar

Что это?

Как использовать?

Добавление элементов из XML ресурсов

Настройка слушателей событий

Интерceptar выбор вкладок

Эти вкладки с изменением цвета выглядят круто. Как это сделать?

А что насчет планшетов?

Все варианты кастомизации

Для BottomBar

Лицензия

Опубликовать ( 0 )

Введение

Обновления

Участники

Недавние действия

OSCHINA-MIRROR/HarmonyOS-tpc-BottomBar