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

    Interface FlexibleVideoOptions

    Interface defining the props for the FlexibleVideo component.

    FlexibleVideo provides a video grid layout with optional screen sharing overlay and annotation capabilities.

    FlexibleVideoOptions

    Grid Configuration:

    interface FlexibleVideoOptions {
        customWidth: number;
        customHeight: number;
        rows: number;
        columns: number;
        componentsToRender: ReactNode[];
        showAspect: boolean;
        backgroundColor?: string;
        Screenboard?: ReactNode;
        annotateScreenStream?: boolean;
        localStreamScreen?: MediaStream;
        style?: object;
        renderContent?: (
            options: {
                defaultContent: ReactNode;
                dimensions: { width: number; height: number };
            },
        ) => ReactNode;
        renderContainer?: (
            options: {
                defaultContainer: ReactNode;
                dimensions: { width: number; height: number };
            },
        ) => ReactNode;
    }
    Index

    Properties

    customWidth customHeight rows columns componentsToRender showAspect backgroundColor? Screenboard? annotateScreenStream? localStreamScreen? style? renderContent? renderContainer?

    Properties

    customWidth: number

    Width for each grid cell (in pixels)

    customHeight: number

    Height for each grid cell (in pixels)

    Display Options:

    rows: number

    Number of rows in the video grid

    columns: number

    Number of columns in the video grid

    componentsToRender: ReactNode[]

    Array of video components to display

    Cell Dimensions:

    showAspect: boolean

    Whether to maintain aspect ratio for grid cells

    backgroundColor?: string

    Background color for each grid cell

    Screen Sharing & Annotation:

    Screenboard?: ReactNode

    Optional screenboard component to overlay on the grid

    annotateScreenStream?: boolean

    Whether to enable screen stream annotation

    localStreamScreen?: MediaStream

    Local screen MediaStream for annotation

    Styling:

    style?: object

    Custom styles for the video grid container

    Advanced Render Overrides:

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

    Function to wrap or replace the default video grid content

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

    Function to wrap or replace the entire video grid container

    Settings

    Member Visibility

    On This Page

    Properties