myCustomChatAudioCard function

Widget myCustomChatAudioCard({
  1. required String name,
  2. required bool barColor,
  3. dynamic textColor,
  4. dynamic cardBackgroundColor,
  5. dynamic customWidth,
  6. dynamic customHeight,
  7. dynamic imageSource,
  8. dynamic roundedImage,
  9. dynamic imageStyle,
})

Custom AudioCard builder for chat sessions Features a green gradient design for audio-only participants

Implementation

Widget myCustomChatAudioCard({
  required String name,
  required bool barColor,
  textColor,
  cardBackgroundColor,
  customWidth,
  customHeight,
  imageSource,
  roundedImage,
  imageStyle,
}) {
  return Container(
    width: customWidth ?? 100,
    height: customHeight ?? 100,
    decoration: BoxDecoration(
      gradient: LinearGradient(
        colors: [Colors.green.shade700, Colors.lightGreen.shade500],
        begin: Alignment.topCenter,
        end: Alignment.bottomCenter,
      ),
      borderRadius: BorderRadius.circular(12),
      border: Border.all(color: Colors.white, width: 2),
      boxShadow: [
        BoxShadow(
          color: Colors.black26,
          blurRadius: 8,
          offset: Offset(0, 4),
        ),
      ],
    ),
    child: Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        // Chat icon
        Container(
          padding: EdgeInsets.all(12),
          decoration: BoxDecoration(
            color: Colors.white24,
            shape: BoxShape.circle,
          ),
          child: Icon(
            Icons.chat,
            color: Colors.white,
            size: 32,
          ),
        ),
        SizedBox(height: 8),

        // Participant name
        Text(
          name,
          style: TextStyle(
            color: Colors.white,
            fontWeight: FontWeight.bold,
            fontSize: 14,
          ),
          maxLines: 1,
          overflow: TextOverflow.ellipsis,
        ),

        // Audio wave indicator
        if (barColor)
          Container(
            margin: EdgeInsets.only(top: 8),
            child: Row(
              mainAxisSize: MainAxisSize.min,
              children: List.generate(
                4,
                (index) => Container(
                  width: 4,
                  height: 20 + (index * 3),
                  margin: EdgeInsets.symmetric(horizontal: 1),
                  decoration: BoxDecoration(
                    color: Colors.white,
                    borderRadius: BorderRadius.circular(2),
                  ),
                ),
              ),
            ),
          ),
      ],
    ),
  );
}