Flutter Skeleton

[pub packages](https://pub.dartlang.org/packages/flutter_skeleton) | 中文说明

Flutter skeleton screen.

Example

Example

Example

Usage

1. Depend

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

dependencies:
  flutter_skeleton: ^0.1.0+1

2. Install

Run command:

$ flutter packages get

3. Import

Import in Dart code:

import 'package:flutter_skeleton/flutter_skeleton.dart';

4. Display Widget

// list skeleton
ListSkeleton(
  style: SkeletonStyle(
    theme: SkeletonTheme.Light,
    isShowAvatar: false,
    barCount: 3,
    colors: [Color(0xff333333), Color(0xffffff45), Color(0xff333333)],
    isAnimation: true,
  ),
);

// card skeleton
CardSkeleton(
  style: SkeletonStyle(
    theme: SkeletonTheme.Light,
    isShowAvatar: true,
    isCircleAvatar: false,
    borderRadius: BorderRadius.all(Radius.circular(16.0)),
    padding: EdgeInsets.all(32.0),
    barCount: 2,
    colors: [Color(0xffffffff)],
    backgroundColor: Color(0xFF009000),
    isAnimation: false,
  ),
);

// card list skeleton
CardListSkeleton(
  style: SkeletonStyle(
    theme: SkeletonTheme.Dark,
    isShowAvatar: true,
    isCircleAvatar: true,
    barCount: 2,
  ),
);

SkeletonStyle Properties

NameTypeMeaningDefault
isAnimationboolif show animation or nottrue
isShowAvatarboolif show avatar or nottrue
isCircleAvatarboolif the avatar is circle or nottrue
barCountintthe count of bar2
borderRadiusBorderRadiusthe radius of container0
paddingEdgeInsetsthe padding of container16
colorsListgradient color of barnull, specified by theme
backgroundColorColorbackground color of containernull, specified by theme
themeSkeletonThemepre-install themeSkeletonTheme.Light

Example

Example sources

Example APK

Example APK Download

Libraries

flutter_skeleton