myCustomChatVideoCard function

Widget myCustomChatVideoCard({
  1. required Participant participant,
  2. required dynamic stream,
  3. required double width,
  4. required double height,
  5. dynamic imageSize,
  6. dynamic doMirror,
  7. dynamic showControls,
  8. dynamic showInfo,
  9. dynamic name,
  10. dynamic backgroundColor,
  11. dynamic onVideoPress,
  12. dynamic parameters,
})

Custom VideoCard builder for chat sessions This replaces the default VideoCard with a custom green gradient design

Implementation

Widget myCustomChatVideoCard({
  required Participant participant,
  required stream,
  required double width,
  required double height,
  imageSize,
  doMirror,
  showControls,
  showInfo,
  name,
  backgroundColor,
  onVideoPress,
  parameters,
}) {
  return Container(
    width: width,
    height: height,
    decoration: BoxDecoration(
      gradient: LinearGradient(
        colors: [Colors.green.shade800, Colors.lightGreen.shade600],
        begin: Alignment.topLeft,
        end: Alignment.bottomRight,
      ),
      borderRadius: BorderRadius.circular(16),
      border: Border.all(color: Colors.white, width: 3),
      boxShadow: [
        BoxShadow(
          color: Colors.black26,
          blurRadius: 10,
          offset: Offset(0, 5),
        ),
      ],
    ),
    child: Stack(
      children: [
        // Video content placeholder
        ClipRRect(
          borderRadius: BorderRadius.circular(13),
          child: Container(
            width: double.infinity,
            height: double.infinity,
            color: Colors.black54,
            child: Center(
              child: Icon(
                Icons.chat_bubble,
                size: 64,
                color: Colors.white70,
              ),
            ),
          ),
        ),
        // Custom chat overlay
        if (showInfo == true)
          Positioned(
            top: 12,
            left: 12,
            child: Container(
              padding: EdgeInsets.symmetric(horizontal: 12, vertical: 6),
              decoration: BoxDecoration(
                gradient: LinearGradient(
                  colors: [Colors.green.shade600, Colors.lightGreen.shade500],
                  begin: Alignment.centerLeft,
                  end: Alignment.centerRight,
                ),
                borderRadius: BorderRadius.circular(8),
              ),
              child: Row(
                mainAxisSize: MainAxisSize.min,
                children: [
                  Icon(Icons.message, color: Colors.white, size: 16),
                  SizedBox(width: 4),
                  Text(
                    name ?? participant.name,
                    style: TextStyle(
                      color: Colors.white,
                      fontWeight: FontWeight.bold,
                      fontSize: 14,
                    ),
                    maxLines: 1,
                    overflow: TextOverflow.ellipsis,
                  ),
                ],
              ),
            ),
          ),
      ],
    ),
  );
}