Similar to Weibo dynamics, WeChat circle of friends, nine grid view controls to display pictures. Support single big picture preview.

Overview

Language: English | 中文简体

Pub      Pub

NineGridView

Similar to Weibo dynamics, WeChat circle of friends, nine grid view controls to display pictures. Support single big picture preview.
It also supports WeChat group , DingTalk group, QQ group avatar effects.

DragSortView

Similar to Weibo/WeChat release dynamic picture selection nine grid view. Support press to enlarge effect, drag and drop sorting, drag and drop to a specified location to delete.

Pub

dependencies:
  nine_grid_view: ^2.0.0

Example

import 'package:nine_grid_view/nine_grid_view.dart';

// bigImage param, It is recommended to use a medium-quality picture, because the original picture is too large and takes time to load.
NineGridView(
  margin: EdgeInsets.all(12),
  padding: EdgeInsets.all(5),
  space: 5,
  type: NineGridType.weChat,//NineGridType.weChat, NineGridType.weiBo
  itemCount: itemCount,
  itemBuilder: (BuildContext context, int index) {},
);

// group avatar.
// need width, height param.
NineGridView(
  width: 120,
  height: 120,
  padding: EdgeInsets.all(5),
  space: 5,
  type: NineGridType.qqGp, //NineGridType.weChatGp, NineGridType.dingTalkGp
  itemCount: itemCount,
  itemBuilder: (BuildContext context, int index) {},
);

// It is recommended to use a thumbnail picture,because the original picture is too large, it may cause repeated loading and cause flashing.
DragSortView(
  imageList,
  space: 5,
  margin: EdgeInsets.all(20),
  padding: EdgeInsets.all(0),
  itemBuilder: (BuildContext context, int index) {},
  initBuilder: (BuildContext context) {},
  onDragListener: (MotionEvent event, double itemWidth) {
    /// Judge to drag to the specified position to delete
    /// return true;
    if (event.globalY > 600) {
      return true;
    }
    return false;
  },
);   

Screenshots

Changelog

Please see the Changelog page to know what's recently changed.

Others

Another NineGridView in flukit UI Kit,using GridView implementation。But in this project used Stack + Positioned。

App

Moss.
A GitHub client app developed with Flutter, which supports Android iOS Web.
Web :Flutter Web.

You might also like...

Widget to let the user search through a keyword string typed on a customizable keyboard in a single or multiple choices list presented as a dropdown in a dialog box or a menu.

Widget to let the user search through a keyword string typed on a customizable keyboard in a single or multiple choices list presented as a dropdown in a dialog box or a menu.

searchable_dropdown Widget to let the user search through a keyword string typed on a customizable keyboard in a single or multiple choices list prese

Sep 11, 2022

A widget that can be dragged and scrolled in a single gesture and snapped to a list of extents.

A widget that can be dragged and scrolled in a single gesture and snapped to a list of extents.

Sliding Sheet A widget that can be dragged and scrolled in a single gesture and snapped to a list of extents. Click here to view the full example. Ins

Mar 10, 2022

Display simple blurry dialog popup for flutter

Display simple blurry dialog popup for flutter

Blurry Dialog Features Display simple blurry dialog popup Offer built-in themes Possibility to create you custom dialog button click handler callbacks

Dec 18, 2022

The flutter_otp_text_field package for flutter is a TextField widget that allows you to display different style pin.

The flutter_otp_text_field package for flutter is a TextField widget that allows you to display different style pin.

flutter_otp_text_field flutter_otp_text_field The flutter_otp_text_field package for flutter is a TextField widget that allows you to display differen

Nov 8, 2022

A Flutter widget to show a text form field to display a date or clock dialog

A Flutter widget to show a text form field to display a date or clock dialog

A Flutter widget to show a text form field to display a date or clock dialog. This widget extend TextField and has a similar behavior as TextFormField.

Jan 6, 2023

A dart package to display a horizontal bar of customisable toggle tabs. Supports iOS and Android.

A dart package to display a horizontal bar of customisable toggle tabs. Supports iOS and Android.

toggle_bar A dart package to display a horizontal bar of customisable toggle tabs. Supports iOS and Android. Installation Depend on it. dependencies:

Jul 13, 2022

📸 Easy to use yet very customizable zoomable image widget for Flutter, Photo View provides a gesture sensitive zoomable widget.

📸 Easy to use yet very customizable zoomable image widget for Flutter, Photo View provides a gesture sensitive zoomable widget.

📸 Easy to use yet very customizable zoomable image widget for Flutter, Photo View provides a gesture sensitive zoomable widget. Photo View is largely used to show interacive images and other stuff such as SVG.

Jan 7, 2023

A widget to provides horizontal or vertical multiple split view for Flutter.

A widget to provides horizontal or vertical multiple split view for Flutter.

Multi split view A widget to provides horizontal or vertical multiple split view for Flutter. Horizontal or vertical Configurable weight or size for e

Dec 28, 2022

NestedScrollView: extended nested scroll view to fix following issues.

NestedScrollView: extended nested scroll view to fix following issues.

Jan 4, 2023
Comments
  • 为什么一张图不放大

    为什么一张图不放大

    NineGridView( margin: EdgeInsets.all(12), padding: EdgeInsets.all(5), space: 5, type: NineGridType.qqGp, itemCount: 1, itemBuilder: (BuildContext context, int index) { return Image.network('https://img1.baidu.com/it/u=3676446160,2628100231&fm=26&fmt=auto&gp=0.jpg'); },

    opened by 18518278831 1
Owner
Flutter中国开源项目
Flutter中文开发者社区开源项目。旨在开发一系列Flutter SDK之外常用(实用)的Package、插件,丰富Flutter第三方库,为Flutter生态贡献来自中国开发者的力量,欢迎所有志同道合的同学一起加入。
Flutter中国开源项目
Displays a highly customizable week view (or day view) which is able to display events, to be scrolled, to be zoomed-in & out and a lot more !

Displays a highly customizable week view (or day view) which is able to display events, to be scrolled, to be zoomed-in & out and a lot more !

Hugo Delaunay 196 Dec 2, 2022
A camera picker in WeChat style.

A camera picker which is an extension for wechat_assets_picker. Based on camera for camera functions and photo_manager for asset implementation.

FlutterCandies 265 Dec 28, 2022
A beautiful circle color picker for flutter.

A beautiful circle color picker for flutter.

Takeshi Tsukamoto 46 Dec 29, 2022
The SpannableGrid is a Flutter widget that allows its cells to span columns and rows and supports moving cells inside the grid.

Spannable Grid The SpannableGrid is a Flutter widget that allows its cells to span columns and rows and supports moving cells inside the grid. Feature

Evgeny Cherkasov 17 Nov 7, 2022
PowerFileView - A powerful file view widget, support a variety of file types, such as Doc Eexcl PPT TXT PDF and so on, Android is implemented by Tencent X5, iOS is implemented by WKWebView.

PowerFileView - A powerful file view widget, support a variety of file types, such as Doc Eexcl PPT TXT PDF and so on, Android is implemented by Tencent X5, iOS is implemented by WKWebView.

Yao 8 Oct 22, 2022
Donation/Support buttons to allow you to add your favorite support buttons like: Paypal, Ko-fi or Patreon and more.

flutter_donation_buttons Donation/Support buttons to allow you to add your favorite support buttons like: Paypal, Ko-fi or Patreon and more. Getting S

null 6 Dec 10, 2022
Build a grouped list, which support expand/collapse section and sticky headers, support use it with sliver widget.

sticky_and_expandable_list Flutter implementation of sticky headers and expandable list.Support use it in a CustomScrollView. README i18n:中文说明 Feature

tp7309 114 Nov 16, 2022
Flutter package: Similar to a ListView, but lets you programmatically jump to any item, by index.

indexed_list_view Similar to a ListView, but lets you programmatically jump to any item, by index. The index jump happens instantly, no matter if you

Marcelo Glasberg 244 Dec 27, 2022
A flutter grouped list widget similar to the iOS UITableview method name.

group_tablelist A flutter grouped list widget similar to the iOS UITableview method name. Group tablelist package for Flutter. Features iOS tableview-

null 2 Aug 17, 2022
A Flutter package which provides helper widgets for selecting single or multiple account/user from the given list.

account_selector A Flutter package which provides helper widgets for selecting single or multiple account/user from a list Supported Dart Versions Dar

Harpreet Singh 49 Oct 7, 2021