@fruits-chain/react-native-xiaoshu/lib/typescript/tab-bar/interface.d.ts

🌈 React Native UI library

import type React from 'react';
import type { ColorValue } from 'react-native';
import type { BottomBarProps } from '../bottom-bar/interface';
export declare type TabValue = number | string;
export declare type TabItem = {
    value: TabValue;
    label: string;
    iconRender?: (color?: ColorValue, isActive?: boolean) => React.ReactElement;
};
export interface TabBarProps extends BottomBarProps {
    /**
     * 文案颜色
     * @default tab_bar_text_color
     */
    textColor?: ColorValue;
    /**
     * 图标颜色
     * @default tab_bar_icon_color
     */
    iconColor?: ColorValue;
    /**
     * 激活的文案颜色
     * @default tab_bar_active_text_color
     */
    activeTextColor?: ColorValue;
    /**
     * 激活的图标颜色
     * @default tab_bar_active_icon_color
     */
    activeIconColor?: ColorValue;
    /**
     * 当前选中的值
     */
    value?: TabValue;
    /**
     * 默认数据
     */
    defaultValue?: TabValue;
    /**
     * tab 数据
     */
    options: TabItem[];
    /**
     * 点击切换回调
     */
    onChange?: (value: TabValue) => void;
    /**
     * 是否采用指示器模式
     * @default false
     */
    indicator?: boolean;
    /**
     * 指示器宽
     * @description 0 表示撑满，其他数值标识固定，不填写与文字同宽
     */
    indicatorWidth?: number;
    /**
     * 指示器高度
     * @description 设置为 0 就是不出现
     * @default 3
     */
    indicatorHeight?: number;
    /**
     * 指示器颜色
     * @default tab_bar_indicator_color
     */
    indicatorColor?: ColorValue;
    /**
     * 排列方式，left 标识自适应宽、有滚动条，center 标识居中、无滚动条
     * @default 'center'
     */
    tabAlign?: 'left' | 'center';
}