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

    Interface MainAspectComponentOptions

    Configuration options for the MainAspectComponent.

    MainAspectComponentOptions

    Content:

    interface MainAspectComponentOptions {
        backgroundColor?: string;
        children: ReactNode;
        showControls?: boolean;
        containerWidthFraction?: number;
        containerHeightFraction?: number;
        defaultFraction?: number;
        updateIsWideScreen: (isWide: boolean) => void;
        updateIsMediumScreen: (isMedium: boolean) => void;
        updateIsSmallScreen: (isSmall: boolean) => void;
        style?: object;
        renderContent?: (
            options: {
                defaultContent: ReactNode;
                dimensions: { width: number; height: number };
            },
        ) => ReactNode;
        renderContainer?: (
            options: {
                defaultContainer: ReactNode;
                dimensions: { width: number; height: number };
            },
        ) => ReactNode;
    }
    Index

    Properties

    backgroundColor?: string

    Background color for the aspect container

    children: ReactNode

    Child components to render inside the aspect container

    Dimensions (Responsive):

    showControls?: boolean

    Whether control bar is visible (adjusts available height using defaultFraction)

    Screen Size Callbacks:

    containerWidthFraction?: number

    Fraction of window width to use (0.0 to 1.0)

    containerHeightFraction?: number

    Fraction of window height to use (0.0 to 1.0)

    defaultFraction?: number

    Height adjustment fraction when controls are shown (applies to height calculation)

    Control Bar Adjustment:

    updateIsWideScreen: (isWide: boolean) => void

    Callback invoked when wide screen state changes (width >= 768px)

    updateIsMediumScreen: (isMedium: boolean) => void

    Callback invoked when medium screen state changes (576px <= width < 768px)

    updateIsSmallScreen: (isSmall: boolean) => void

    Callback invoked when small screen state changes (width < 576px)

    Styling:

    style?: object

    Additional custom styles to apply to the container

    Advanced Render Overrides:

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

    Optional custom renderer for 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)