FLUTTER ECOSYSTEM

bizz84/layout-demo-flutter

超實用的 Flutter 平面設計 - 隨身攜帶。😉

在 GitHub 查看 ↗

layout-demo-flutter 專案封面

Stars: 1408
Forks: 331
最近推送（UTC）: 2026年9月17日
專案狀態: 未封存

GITHUB User

Andrea Bizzotto ↗

Flutter GDE ❖ Creator of codewithandrea.com ❖ YouTube: nnbd.me/yt ❖ Complete Dart Course: nnbd.me/dart

https://codewithandrea.comLondon官方網站 ↗

語言DartSwiftPythonHTMLShellKotlinObjective-C

技術主題

# flutter # flutter-layouts # youtube # ios # android # dartlang

使用的依賴

依賴清單 5 項

flutter{"sdk":"flutter"}
flutter_launcher_icons^0.14.4
cupertino_icons^1.0.8
flutter_test開發依賴{"sdk":"flutter"}
flutter_lints開發依賴^6.0.0

所在榜單

原始 README

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

展開 / 收合專案 README

Super Useful Flutter Layouts - Right in Your Pocket. 😉

Update: Flutter web app preview here: https://flutter-layouts-demo.web.app/

YouTube video walkthroughs with explanations here:

Flutter Layouts: Row, Column, Stack, Expanded, Padding

Flutter Layouts: PageView, ListView, GridView, Slivers, Hero Imaegs

This app shows you how to use the most common layouts in Flutter.

You can run this project on your simulator or device.

Oh, and the app itself is built with - guess what - a combination of Flutter layouts. So Meta! 😎

For more articles and video tutorials, check out Code with Andrea.

Table of Contents

Table of Contents

Row / Column

https://github.com/bizz84/layout-demo-flutter/raw/master/screenshots/row-column.png

Baseline

https://github.com/bizz84/layout-demo-flutter/raw/master/screenshots/baseline.png

Stack

https://github.com/bizz84/layout-demo-flutter/raw/master/screenshots/stack.png

Expanded

Wikipedia: Golden Spiral (also: Fibonacci, Golden Ratio).

https://github.com/bizz84/layout-demo-flutter/raw/master/screenshots/expanded.png

Padding

https://github.com/bizz84/layout-demo-flutter/raw/master/screenshots/padding.png

PageView

PageView

https://github.com/bizz84/layout-demo-flutter/raw/master/screenshots/page-view.png

ListView

https://github.com/bizz84/layout-demo-flutter/raw/master/screenshots/list.png

Slivers

https://github.com/bizz84/layout-demo-flutter/raw/master/screenshots/slivers.png

Hero Image

https://github.com/bizz84/layout-demo-flutter/raw/master/screenshots/hero.jpg

Nested Lists

ListView

https://github.com/bizz84/layout-demo-flutter/raw/master/screenshots/nested.png

For more articles and video tutorials, check out Code With Andrea.

License: MIT

Attribution

Youtube Play Icon by Youtube Clipart.