[PR #7803] [MERGED] feat: implement afdivider #8124

New issue

Closed

opened 2026-03-23 23:22:43 +00:00 by mirror · 0 comments

mirror commented

2026-03-23 23:22:43 +00:00

Owner

📋 Pull Request Information

Original PR: https://github.com/AppFlowy-IO/AppFlowy/pull/7803
Author: @richardshiue
Created: 4/22/2025
Status: ✅ Merged
Merged: 4/22/2025
Merged by: @LucasXu0

Base: main ← Head: feat/divider

📝 Commits (1)

d2266ef feat: implement afdivider

📊 Changes

2 files changed (+54 additions, -0 deletions)

View changed files

📝 frontend/appflowy_flutter/packages/appflowy_ui/lib/src/component/component.dart (+1 -0)
➕ frontend/appflowy_flutter/packages/appflowy_ui/lib/src/component/separator/divider.dart (+53 -0)

📄 Description

To create a divider with 4 pixels spacing on the top and bottom:

Using Material's Divider:

Divider(
    color: AppFlowyTheme.of(context).borderColorScheme.greyTertiary,
    height: 9.0, // 4.0 * 2 (spacing) + 1.0 (thickness)
)

Using AFDivider:

AFDivider(
    spacing: 4.0,
)

Note: Material's Divider allows setting thickness to 0 to have a "hairline border". This component doesn't support it and don't plan to either.

Feature Preview

PR Checklist

My code adheres to AppFlowy's Conventions
I've listed at least one issue that this PR fixes in the description above.
I've added a test(s) to validate changes in this PR, or this PR only contains semantic changes.
All existing tests are passing.

Summary by Sourcery

Implement a custom AFDivider component with flexible spacing and orientation options

New Features:

Create a new AFDivider widget that provides more customization options compared to Material's Divider, with built-in spacing control and theme-aware color defaults

Enhancements:

Add support for both horizontal and vertical divider orientations
Implement configurable thickness, spacing, and indentation for dividers

_{🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.}

## 📋 Pull Request Information **Original PR:** https://github.com/AppFlowy-IO/AppFlowy/pull/7803 **Author:** [@richardshiue](https://github.com/richardshiue) **Created:** 4/22/2025 **Status:** ✅ Merged **Merged:** 4/22/2025 **Merged by:** [@LucasXu0](https://github.com/LucasXu0) **Base:** `main` ← **Head:** `feat/divider` --- ### 📝 Commits (1) - [`d2266ef`](https://github.com/AppFlowy-IO/AppFlowy/commit/d2266ef8c5d242b3a080438a5091e9861e6aacaa) feat: implement afdivider ### 📊 Changes **2 files changed** (+54 additions, -0 deletions) <details> <summary>View changed files</summary> 📝 `frontend/appflowy_flutter/packages/appflowy_ui/lib/src/component/component.dart` (+1 -0) ➕ `frontend/appflowy_flutter/packages/appflowy_ui/lib/src/component/separator/divider.dart` (+53 -0) </details> ### 📄 Description To create a divider with 4 pixels spacing on the top and bottom: Using Material's Divider: ``` Divider( color: AppFlowyTheme.of(context).borderColorScheme.greyTertiary, height: 9.0, // 4.0 * 2 (spacing) + 1.0 (thickness) ) ``` Using AFDivider: ``` AFDivider( spacing: 4.0, ) ``` Note: Material's Divider allows setting thickness to 0 to have a "hairline border". This component doesn't support it and don't plan to either. ### Feature Preview  ---  #### PR Checklist - [ ] My code adheres to [AppFlowy's Conventions](https://docs.appflowy.io/docs/documentation/software-contributions/conventions) - [ ] I've listed at least one issue that this PR fixes in the description above. - [ ] I've added a test(s) to validate changes in this PR, or this PR only contains semantic changes. - [ ] All existing tests are passing. ## Summary by Sourcery Implement a custom AFDivider component with flexible spacing and orientation options New Features: - Create a new AFDivider widget that provides more customization options compared to Material's Divider, with built-in spacing control and theme-aware color defaults Enhancements: - Add support for both horizontal and vertical divider orientations - Implement configurable thickness, spacing, and indentation for dividers --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>