MediaSFU React Native (Expo)
    Preparing search index...

    Interface ControlButtonsComponentOptions

    Configuration options for the ControlButtonsComponent.

    ControlButtonsComponentOptions

    Button Configuration:

    interface ControlButtonsComponentOptions {
        buttons: Button[];
        buttonColor?: string;
        buttonBackgroundColor?: { default?: string; pressed?: string };
        alignment?:
            | "center"
            | "flex-start"
            | "flex-end"
            | "space-between"
            | "space-around"
            | "space-evenly";
        vertical?: boolean;
        buttonsContainerStyle?: StyleProp<ViewStyle>;
        alternateIconComponent?: Element;
        iconComponent?: Element;
        style?: object;
        renderContent?: (
            options: {
                defaultContent: ReactNode;
                dimensions: { width: number; height: number };
            },
        ) => ReactNode;
        renderContainer?: (
            options: {
                defaultContainer: ReactNode;
                dimensions: { width: number; height: number };
            },
        ) => ReactNode;
    }
    Index

    Properties

    buttons buttonColor? buttonBackgroundColor? alignment? vertical? buttonsContainerStyle? alternateIconComponent? iconComponent? style? renderContent? renderContainer?

    Properties

    buttons: Button[]

    Array of button configurations

    Layout:

    buttonColor?: string

    Default color for button icons

    buttonBackgroundColor?: { default?: string; pressed?: string }

    Background colors with default and pressed states

    alignment?:
        | "center"
        | "flex-start"
        | "flex-end"
        | "space-between"
        | "space-around"
        | "space-evenly"

    Button alignment within container

    vertical?: boolean

    Whether to arrange buttons vertically (true) or horizontally (false)

    Styling:

    buttonsContainerStyle?: StyleProp<ViewStyle>

    Custom styles for buttons container

    alternateIconComponent?: Element

    Global alternate icon component

    iconComponent?: Element

    Global icon component

    Advanced Render Overrides:

    style?: object

    Additional custom styles for outer container

    Custom Icons:

    renderContent?: (
        options: {
            defaultContent: ReactNode;
            dimensions: { width: number; height: number };
        },
    ) => ReactNode

    Optional custom renderer for button content (receives defaultContent and dimensions)

    renderContainer?: (
        options: {
            defaultContainer: ReactNode;
            dimensions: { width: number; height: number };
        },
    ) => ReactNode

    Optional custom renderer for outer container (receives defaultContainer and dimensions)

    Settings

    Member Visibility

    On This Page

    Properties