Skip to main content

Media Screen

Introduction​

The Media Screen supports media forwarding and previewing. It provides interfaces to preview media files and forward them to other users or chatrooms. Developers can customize the interface using builders, configurations, and style options found across forwarding and preview configurations.

1. LMChatMediaForwardingScreen Widget​

File Location:
media_forwarding.dart

Class Declaration​

class LMChatMediaForwardingScreen extends StatelessWidget {
  const LMChatMediaForwardingScreen({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Forward Media'),
      ),
      body: Center(
        child: const Text('Media Forwarding UI'),
      ),
    );
  }
}

This widget allows users to forward media files to other chatrooms or participants.

2. LMChatMediaPreviewScreen Widget​

File Location:
media_preview.dart

Class Declaration​

class LMChatMediaPreviewScreen extends StatefulWidget {
  final List<LMChatMedia> mediaList;
  final int initialPosition;

  const LMChatMediaPreviewScreen({
    super.key,
    required this.mediaList,
    this.initialPosition = 0,
  });

  @override
  State<LMChatMediaPreviewScreen> createState() =>
      _LMChatMediaPreviewScreenState();
}

This widget allows users to preview media items such as images and videos in a carousel-style format.

3. Builder Configurations​

forwarding/builder.dart​

File Location:
forwarding/builder.dart

class LMChatMediaForwardingBuilderDelegate {
  const LMChatMediaForwardingBuilderDelegate();
}
  • Purpose: Customizes the forwarding interface, such as the app bar and the layout of forwarded media.

Methods in LMChatMediaForwardingBuilderDelegate​

  1. forwardingAppBarBuilder
    Definition: Customizes the app bar for the forwarding screen.

    Usage Example:

    @override
    PreferredSizeWidget forwardingAppBarBuilder(BuildContext context) {
      return AppBar(title: const Text('Forward Media'));
    }

  2. mediaItemBuilder
    Definition: Builds individual media items in the forwarding list.

    Usage Example:

    @override
    Widget mediaItemBuilder(BuildContext context, LMChatMedia media) {
      return ListTile(title: Text(media.name));
    }

preview/builder.dart​

File Location:
preview/builder.dart

class LMChatMediaPreviewBuilderDelegate {
  const LMChatMediaPreviewBuilderDelegate();
}
  • Purpose: Provides customization options for the preview screen, including the layout and navigation behavior.

4. Setting Configurations​

forwarding/setting.dart​

File Location:
forwarding/setting.dart

class LMChatMediaForwardingSetting {
  const LMChatMediaForwardingSetting();
}
  • Purpose: Configures forwarding settings, such as confirmation prompts or limitations on forwarded items.

preview/setting.dart​

File Location:
preview/setting.dart

class LMChatMediaPreviewSetting {
  const LMChatMediaPreviewSetting();
}
  • Purpose: Configures preview settings, such as the initial position of media files or the visibility of thumbnails.

5. Style Configurations​

forwarding/style.dart​

File Location:
forwarding/style.dart

class LMChatMediaForwardingStyle {
  const LMChatMediaForwardingStyle();
}
  • Purpose: Provides styling options for forwarding screens, such as colors and fonts for forwarded media items.

preview/style.dart​

File Location:
preview/style.dart

class LMChatMediaPreviewStyle {
  const LMChatMediaPreviewStyle();
}
  • Purpose: Provides styling options for preview screens, such as scaling and padding of media items.

6. Configurations​

forwarding/config.dart​

File Location:
forwarding/config.dart

class LMChatMediaForwardingConfig {
  final LMChatMediaForwardingBuilderDelegate builder;
  final LMChatMediaForwardingStyle style;
  final LMChatMediaForwardingSetting setting;

  const LMChatMediaForwardingConfig({
    this.builder = const LMChatMediaForwardingBuilderDelegate(),
    this.style = const LMChatMediaForwardingStyle(),
    this.setting = const LMChatMediaForwardingSetting(),
  });
}

preview/config.dart​

File Location:
preview/config.dart

class LMChatMediaPreviewConfig {
  final LMChatMediaPreviewBuilderDelegate builder;
  final LMChatMediaPreviewStyle style;
  final LMChatMediaPreviewSetting setting;

  const LMChatMediaPreviewConfig({
    this.builder = const LMChatMediaPreviewBuilderDelegate(),
    this.style = const LMChatMediaPreviewStyle(),
    this.setting = const LMChatMediaPreviewSetting(),
  });
}

7. Summary​

The Media Screen offers media forwarding and previewing features within chatrooms. Developers can use builder delegates, settings, and styles to control the appearance and behavior of media forwarding and preview screens. Custom configurations can be injected into the app using the provided config classes.