tip_flutter_image_view 0.1.5

  • Readme
  • Changelog
  • Example
  • Installing
  • 62

tip_flutter_image_view #

使用 #

import 'package:tip_flutter_image_view/tip_flutter_image_view.dart';

TipFlutterImageView(
                url: imageUrl,
                width: width,
                height: height,
                aspectRatio: MediaQuery.of(context).devicePixelRatio,
                centerCrop: true,
              ),

利用texture来渲染原生图片资源的插件 #

12fb3e14-f712-4c9b-9368-8a9391e067cd.gif

目前支持

普通bitmap,webp,gif

相关文章

OpenGL with Texture widget

todo
  1. 增加一个loading和err
  2. 进一步优化性能

0.1.2 #

优化了gif展示

0.1.1 #

修改了一下readme

0.1.0 #

ios版本已实现

0.0.1 #

example/lib/main.dart

import 'package:flutter/material.dart';

import 'package:tip_flutter_image_view/tip_flutter_image_view.dart';
import 'package:tip_flutter_image_view_example/image_list.dart';

void main() => runApp(MyApp());

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MainPage(),
    );
  }
}

class MainPage extends StatefulWidget {
  @override
  _MainPageState createState() => _MainPageState();
}

class _MainPageState extends State<MainPage> {
  double width = 300;
  double height = 300;
  bool useFlutterImage = false;
  String imageUrl =
      "https://pic-30134.picsz.qpic.cn/d321beac940b4bec9735c49dc4a1";

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('flutter使用原生ImageView'),
        actions: <Widget>[
          IconButton(
            icon: Icon(Icons.list),
            onPressed: () {
              Navigator.pushReplacement(
                context,
                new MaterialPageRoute(
                    maintainState: false,
                    builder: (context) => new ImageListDemo()),
              );
            },
          )
        ],
      ),
      body: Stack(
        children: <Widget>[
          Column(
            children: <Widget>[
              Expanded(
                flex: 1,
                child: Container(),
              ),
              Text('flutter这边的图片container参数设置'),
              Row(
                children: <Widget>[
                  Text('flutter上的宽度'),
                  Slider(
                      value: width,
                      min: 100,
                      max: 400,
                      onChanged: (value) {
                        setState(() {
                          width = value.roundToDouble();
                        });
                      }),
                ],
              ),
              Row(
                children: <Widget>[
                  Text('flutter上的高度'),
                  Slider(
                      value: height,
                      min: 100,
                      max: 400,
                      onChanged: (value) {
                        setState(() {
                          height = value.roundToDouble();
                        });
                      }),
                ],
              ),
              Row(
                children: <Widget>[
                  Text('是否使用原生层加载图片'),
                  Checkbox(
                    value: useFlutterImage,
                    onChanged: (value) {
                      setState(() {
                        useFlutterImage = value;
                      });
                    },
                  )
                ],
              ),
            ],
          ),
          Center(
            child: Container(
              width: width,
              height: height,
              child: useFlutterImage
                  ? TipFlutterImageView(
                      url: imageUrl,
                      width: width,
                      height: height,
                      aspectRatio: MediaQuery.of(context).devicePixelRatio,
                      centerCrop: true,
                    )
                  : Image.network(
                      imageUrl,
                      fit: BoxFit.cover,
                      width: width,
                      height: height,
                    ),
            ),
          )
        ],
      ),
    );
  }
}

Use this package as a library

1. Depend on it

Add this to your package's pubspec.yaml file:


dependencies:
  tip_flutter_image_view: ^0.1.5

2. Install it

You can install packages from the command line:

with Flutter:


$ flutter pub get

Alternatively, your editor might support flutter pub get. Check the docs for your editor to learn more.

3. Import it

Now in your Dart code, you can use:


import 'package:tip_flutter_image_view/tip_flutter_image_view.dart';
  
Popularity:
Describes how popular the package is relative to other packages. [more]
25
Health:
Code health derived from static analysis. [more]
99
Maintenance:
Reflects how tidy and up-to-date the package is. [more]
100
Overall:
Weighted score of the above. [more]
62
Learn more about scoring.

We analyzed this package on Apr 4, 2020, and provided a score, details, and suggestions below. Analysis was completed with status completed using:

  • Dart: 2.7.1
  • pana: 0.13.6
  • Flutter: 1.12.13+hotfix.8

Health suggestions

Fix lib/tip_flutter_image_view.dart. (-1 points)

Analysis of lib/tip_flutter_image_view.dart reported 2 hints:

line 33 col 15: The value of the field '_stream' isn't used.

line 117 col 7: The declaration '_parseState' isn't referenced.

Dependencies

Package Constraint Resolved Available
Direct dependencies
Dart SDK >=2.1.0 <3.0.0
crypto ^2.1.3 2.1.4
flutter 0.0.0
Transitive dependencies
charcode 1.1.3
collection 1.14.11 1.14.12
convert 2.1.1
meta 1.1.8
sky_engine 0.0.99
typed_data 1.1.6
vector_math 2.0.8
Dev dependencies
flutter_test