mirror of
https://github.com/AppFlowy-IO/AppFlowy.git
synced 2024-09-11 19:17:43 +03:00
feat: adjust toolbar count based on the screen size (#5243)
This commit is contained in:
parent
7831d8d4ab
commit
016e131bd3
@ -461,8 +461,13 @@ class _ToolbarItemListViewState extends State<_ToolbarItemListView> {
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
const left = 8.0;
|
||||
const right = 4.0;
|
||||
// 68.0 is the width of the close keyboard/menu button
|
||||
final padding = _calculatePadding(left + right + 68.0);
|
||||
|
||||
final children = [
|
||||
const HSpace(8),
|
||||
const HSpace(left),
|
||||
...widget.toolbarItems
|
||||
.mapIndexed(
|
||||
(index, element) => element.itemBuilder.call(
|
||||
@ -481,9 +486,9 @@ class _ToolbarItemListViewState extends State<_ToolbarItemListView> {
|
||||
: null,
|
||||
),
|
||||
)
|
||||
.map((e) => [e, const HSpace(10)])
|
||||
.map((e) => [e, HSpace(padding)])
|
||||
.flattened,
|
||||
const HSpace(4),
|
||||
const HSpace(right),
|
||||
];
|
||||
|
||||
return PageStorage(
|
||||
@ -499,6 +504,23 @@ class _ToolbarItemListViewState extends State<_ToolbarItemListView> {
|
||||
);
|
||||
}
|
||||
|
||||
double _calculatePadding(double extent) {
|
||||
final screenWidth = MediaQuery.of(context).size.width;
|
||||
final width = screenWidth - extent;
|
||||
final int count;
|
||||
if (screenWidth <= 340) {
|
||||
count = 5;
|
||||
} else if (screenWidth <= 384) {
|
||||
count = 6;
|
||||
} else if (screenWidth <= 430) {
|
||||
count = 7;
|
||||
} else {
|
||||
count = 8;
|
||||
}
|
||||
// left + item count * width + item count * padding + right + close button width = screenWidth
|
||||
return (width - count * 40.0) / count;
|
||||
}
|
||||
|
||||
void _debounceUpdatePilotPosition() {
|
||||
Debounce.debounce(
|
||||
'updatePilotPosition',
|
||||
@ -539,17 +561,3 @@ class _ToolbarItemListViewState extends State<_ToolbarItemListView> {
|
||||
previousSelection = selection;
|
||||
}
|
||||
}
|
||||
|
||||
// class _MyClipper extends CustomClipper<Rect> {
|
||||
// const _MyClipper({
|
||||
// this.offset = 0,
|
||||
// });
|
||||
|
||||
// final double offset;
|
||||
|
||||
// @override
|
||||
// Rect getClip(Size size) => Rect.fromLTWH(offset, 0, 64.0, 46.0);
|
||||
|
||||
// @override
|
||||
// bool shouldReclip(CustomClipper<Rect> oldClipper) => false;
|
||||
// }
|
||||
|
Loading…
Reference in New Issue
Block a user