FLUTTER ECOSYSTEM

asjqkkkk/circle_list

一個用於圓形列表的新Flutter套件。

circle_list 專案封面
Stars
38
Forks
12
最近推送(UTC)
2023年4月10日
專案狀態
已封存
Morn GitHub avatar
GITHUB User

Morn ↗

code fun,enjoy life

China
語言DartHTMLShellSwiftKotlinObjective-C

此儲存庫發佈的套件

使用的依賴

依賴清單 2 項
  • flutter{"sdk":"flutter"}
  • flutter_test開發依賴{"sdk":"flutter"}

原始 README

以下為英文專案原文快照,最新內容請造訪 GitHub。

展開 / 收合專案 README

circle_list

A new Flutter package for Circle List.

Add dependency

dependencies:
  circle_list: ^1.0.2

Super simple to use

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

class ShowDemoPage extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(backgroundColor: Colors.white,),
      body: Center(
        child: CircleList(
          origin: Offset(0, 0),
          children: List.generate(10, (index) {
            return Icon(
              Icons.details,
              color: index % 2 == 0 ? Colors.blue : Colors.orange,
            );
          }),
        ),
      ),
    );
  }
}

image

If you want to add gradient background
CircleList(
          gradient: LinearGradient(
            colors: [Colors.redAccent, Colors.blueAccent],
          ),
          origin: Offset(0, 0),
          children: List.generate(10, (index) {
            return Icon(
              Icons.details,
              color: index % 2 == 0 ? Colors.blue : Colors.orange,
            );
          }),
        ),

image

Another background
CircleList(
          innerCircleColor: Colors.redAccent,
          outerCircleColor: Colors.greenAccent,
          origin: Offset(0, 0),
          children: List.generate(10, (index) {
            return Icon(
              Icons.details,
              color: index % 2 == 0 ? Colors.blue : Colors.orange,
            );
          }),
        )

image

CenterWidget
CircleList(
          origin: Offset(0, 0),
          children: List.generate(10, (index) {
            return Icon(
              Icons.details,
              color: index % 2 == 0 ? Colors.blue : Colors.orange,
            );
          }),
          centerWidget: ClipRRect(
              borderRadius: BorderRadius.all(Radius.circular(100)),
              child: Image.asset("images/avator.jpg")),
        ),

image

Demo

image

The Demo Link

Params

  double innerRadius;
  double outerRadius;
  double childrenPadding;
  double initialAngle;
  Color outerCircleColor;
  Color innerCircleColor;
  Gradient gradient;
  Offset origin;
  List<Widget> children;
  bool isChildrenVertical;
  RotateMode rotateMode;
  bool innerCircleRotateWithChildren;
  bool showInitialAnimation;
  Widget centerWidget;
  RadialDragStart onDragStart;
  RadialDragUpdate onDragUpdate;
  RadialDragEnd onDragEnd;
  AnimationSetting animationSetting;