dp_widget 0.0.1

A custom widget built on cached_network image and other widgets to allow you display file image, network image and placeholders as appropriate without handling the state or switching manually.

example/lib/main.dart

import 'dart:io';

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

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

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Dp Widget Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const SamplePage(title: 'Dp Widget Demo Page'),
    );
  }
}

class SamplePage extends StatefulWidget {
  const SamplePage({Key? key, required this.title}) : super(key: key);
  final String title;

  @override
  State<SamplePage> createState() => _SamplePageState();
}

class _SamplePageState extends State<SamplePage> {
  final GlobalKey<ScaffoldState> _scaffoldKey = GlobalKey();
  String? imageUrl;
  File? imageFile;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      key: _scaffoldKey,
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Padding(
          padding: const EdgeInsets.all(8.0),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.start,
            children: [
              DpImageWidget(
                imageUrl: imageUrl,
                imageFile: imageFile,
                editCallback: () async {
                  // Add the process of selecting and probably uploading the image file here
                  ScaffoldMessenger.of(context).showSnackBar(
                      const SnackBar(content: Text("Select a file here")));
                  await Future.delayed(const Duration(milliseconds: 200));
                  setState(() {
                    imageUrl = "https://picsum.photos/200/300?random=1";
                  });
                },
              ),
              const Padding(
                padding: EdgeInsets.all(8.0),
                child: Text("Default Icon Placeholder"),
              ),
              const SizedBox(
                height: 10,
              ),
              const DpImageWidget(
                imageUrl: "https://picsum.photos/200/300?random=2",
                isCircular: false,
                editable: false,
              ),
              const Padding(
                padding: EdgeInsets.all(8.0),
                child: Text("Rectangular non-editable"),
              ),
              const DpImageWidget(
                imageUrl: "https://picsum.photos/200/300?random=2",
                editable: false,
                frameRadius: 32,
              ),
              const Padding(
                padding: EdgeInsets.all(8.0),
                child: Text("Circular non-editable"),
              ),
              const SizedBox(
                height: 10,
              ),
              const DpImageWidget(
                placeholderAsset: "asset/avatar.png",
                editIcon: Icons.camera_alt_rounded,
              ),
              const Padding(
                padding: EdgeInsets.all(8.0),
                child: Text("Asset Image Placeholder"),
              ),
            ],
          ),
        ),
      ),
    );
  }
}