pixel_perfect

Put a semi-transparent image with the design over the top of the developed layout. It helps you to compare original design and current page.

Getting started

Add pixel_perfect in your pubspec.yaml dependencies.

dependencies:
                 pixel_perfect: any
                

How To Use

Simple use

Add assets folder with images to your pubspec.yaml

  uses-material-design: true
                  assets:
                    - assets/
                

Import the following package in your dart file

import 'package:pixel_perfect/pixel_perfect.dart';
                

                return PixelPerfect(
                  assetPath: 'assets/design.png', // path to your asset image
                  scale: 1 // scale value (optional)
                  initBottom: 20, //  default bottom distance (optional)
                  offset: Offset.zero, // default image offset (optional)
                  initOpacity: 0.4 // init opacity value (optional)
                  child: Scaffold(
                    ..
                  )
                )
                

Extended use

                return PixelPerfect.extended(
                  image: Image.asset( // any image file
                    'assets/element.png',
                    scale: 2,
                  ), 
                  initBottom: 20, //  default bottom distance (optional)
                  offset: Offset.zero, // default image offset (optional)
                  initOpacity: 0.4 // init opacity value (optional)
                  child: Scaffold(
                    ..
                  )
                )
                

Video tutorials by Learn App Code

How to Make Pixel Perfect Flutter Apps
How to Make Responsive Flutter Apps, Pixel Perfect

1.1.3

• Fix

1.1.2

• ThemeData's accent migration

1.1.1

• update readme.md

1.1.0

• Switching off dragging when image is fully transparent. (Opacity is equal to 0)

1.0.9

• add flutter awesome badge

1.0.8

• add hide unhide functionality
• add initial opacity parameter
• add logo

1.0.7

• add abserb pointer

1.0.6

• long images fix

1.0.5

• Better description

1.0.4

• Add effective dart

1.0.3

• Add extended widget

1.0.2

• Update readme

1.0.1

• Update readme

1.0.0

• Init realize