color_extract Download - color_extract Quellcode herunterladen

color_extract

Anderer Quellcode

1.0.0

Herunterladen

color_extract

Color Extract ist ein Flutterpaket, mit dem Sie Farben aus den Widgets Ihrer App extrahieren und berechnen können. Sie können es verwenden, um die Farbe eines Widgets abhängig/basierend auf der Farbe des Hintergrunds (dem anderen Widget dahinter) zu ändern.

Vorschau

(Der Video -Player kann nicht auf Pub.dev angezeigt werden, github.com überprüfen)

Vorschau.MP4

Demo

In dieser Demo sehen Sie, wie Sie Ihr Widget wie ein Chamäleon ändern können.

Installation

Fügen Sie Ihrem pubspec.yaml Folgendes hinzu:

 dependencies :
  color_extract : ^1.0.1

Dann rennen Sie flutter pub get .

Verwendung

Colorextraktor

Der ColorExtractor Es ist das Widget, aus dem wir die durchschnittliche Farbe extrahieren möchten. Es dient als Wrapper für Repaintboundary, sodass Sie als Alternative Repaintary als Alternative verwenden können.

 ColorExtractor (
  boundaryKey : GlobalKey (),
  child : Container (
    width : 200 ,
    height : 200 ,
    color : Colors .red,
  ),
);

Coloraverager

Das ColorAverager -Widget berechnet die durchschnittliche Farbe eines bestimmten Teils von ColorExtractor oder RepaintBoundary . Seine Anwendung ist nützlich, um die dominierende Farbe eines bestimmten Bereichs zu bestimmen, z. B. den Hintergrund hinter einem Logo, Bild.

 ColorAverager (
  boundaryKey : GlobalKey (),
  child : SizedBox (
    width : 50 ,
    height : 50 ,
  ),
  onChanged : (color) {
    // Handle the new average color.
  },
);

Sie können auch den ColorAveragerController verwenden, um die durchschnittliche Farbe programmgesteuert zu berechnen.

 final controller = ColorAveragerController ();

// ... render the widget ...

final avgColor = await controller. calculateAvgColor ();

Beispiel

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

class MyHomePage extends StatelessWidget {
  @override
  Widget build ( BuildContext context) {
    return Scaffold (
      body : Stack (
        children : [
          ColorExtractor (
            boundaryKey : boundaryKey,
            child : Container (
              width : 200 ,
              height : 200 ,
              color : Colors .blue,
            ),
          ),
          ColorAverager (
            // boundaryKey should be the same one in the above ColorExtractor boundaryKey
            boundaryKey : boundaryKey,
            // You can use the controller (ColorAveragerController) too.
            // controller: controller,
            child : const SizedBox (width : 50 , height : 50 ),
            onChanged : (color) {
                // Do something with the average color.
                // color should be = Colors.blue
            },
          )
        ],
      )
    );
  }
}