bubble_picker 0.0.3 copy "bubble_picker: ^0.0.3" to clipboard
bubble_picker: ^0.0.3 copied to clipboard

A Flutter widget for displaying and interacting with customizable, animated bubbles which grow in size when selected.

example/lib/main.dart

import 'package:bubble_picker/bubble_picker.dart';
import 'package:flutter/material.dart';

void main() {
  runApp(const ExampleApp());
}

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

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      home: Scaffold(
        body: GradientBubblePicker(),
      ),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    List<String> emotions = [
      'Love',
      'Fear',
      'Joy',
      'Hope',
      'Hate',
      'Calm',
    ];

    // List of gradients to be applied to the bubbles
    List<LinearGradient> gradients = [
      const LinearGradient(
        colors: [Color(0xFFFF7E5F), Color.fromARGB(255, 21, 20, 18)],
        begin: Alignment.topLeft,
        end: Alignment.bottomRight,
      ),
      const LinearGradient(
        colors: [Color(0xFF00B4DB), Color(0xFF0083B0)],
        begin: Alignment.topLeft,
        end: Alignment.bottomRight,
      ),
      const LinearGradient(
        colors: [Color(0xFF7F00FF), Color(0xFFE100FF)],
        begin: Alignment.topLeft,
        end: Alignment.bottomRight,
      ),
      LinearGradient(
        colors: [
          const Color(0xFFFF6A88).withOpacity(0.5),
          const Color(0xFFFFD194).withOpacity(0.5),
        ],
        begin: Alignment.topLeft,
        end: Alignment.bottomRight,
      ),
      const LinearGradient(
        colors: [Color(0xFF00C9FF), Color(0xFF92FE9D)],
        begin: Alignment.topLeft,
        end: Alignment.bottomRight,
      ),
      const LinearGradient(
        colors: [Color(0xFFFF9A9E), Color(0xFFFAD0C4)],
        begin: Alignment.topLeft,
        end: Alignment.bottomRight,
      ),
    ];

    return Center(
      child: BubblePicker(
        bubbles: List.generate(emotions.length, (index) {
          return BubbleData(
            imageProvider: const NetworkImage(
              'https://flexible.img.hani.co.kr/flexible/normal/970/644/imgdb/resize/2019/0404/00503871_20190404.JPG',
            ),
            gradient: gradients[index],
            child: Text(
              emotions[index],
              style: const TextStyle(color: Colors.white),
            ),
          );
        }),
      ),
    );
  }
}
22
likes
160
points
21
downloads

Publisher

unverified uploader

Weekly Downloads

A Flutter widget for displaying and interacting with customizable, animated bubbles which grow in size when selected.

Repository (GitHub)
View/report issues

Documentation

API reference

License

MIT (license)

Dependencies

flutter

More

Packages that depend on bubble_picker