Hacktoberfest 2026：メンテナが10月に向けて印を付けた、オープンで初心者向けの issue。 Hacktoberfest の issue を見る

bug: `BottomAppBar` custom margins break `NotchShape` calculation due to coordinate offsets

オープン
  • 何か問題がありますか？
#6,986 コメント 0 件 リアクション 0 件 担当者 0 名 GitHub で見る

メンテナーはふだん 2 日以内に返信

まだ誰も着手していません。

評価

難易度
4/5
見積もり時間
3〜5日
初心者へのやさしさ
48/100
issue の種類
機能追加
明瞭さ
おおむね明確
活発さ
活発
技術スタック
flutter, python
領域
frontend, mobile

調査の方向性

Start by tracing the Python BottomAppBar and notch shape bindings into the Flutter handler that calculates the notch path; the issue names no source files or tests. Reproduce the supplied example and inspect how custom margins affect the guest rectangle and cutout coordinates. Done means the notch stays aligned with the floating action button when the bar has custom margins, with offset adjustment available through the bindings.

索引モデルが issue の本文から書いたものです。

説明

bug
Duplicate Check
Describe the bug

When configuring a BottomAppBar with custom spatial styling (such as adjusting outer margins/paddings or wrapping its internal contents inside a padded container to make a modern "floating capsule" navigation bar), the underlying Flutter NotchShape engine fails to align the cutout coordinates properly.

Because Flet relies entirely on fixed enum declarations (ft.NotchShape.CIRCULAR_RECTANGLE) or rigid configuration wrappers (ft.AutomaticNotchShape), python developers have no mechanism to pass custom math offsets (such as adjusting dxOffset or dyOffset) or shifting guest coordinate bounds inside the shape path calculation. As a result, adding margins to the bar permanently misaligns or deletes the cutout relative to a docked FloatingActionButton's position.

Code sample
Code 
import flet as ft


def main(page: ft.Page) -> None:
    page.title = "Notch Shape Example"

    page.bottom_appbar = ft.BottomAppBar(
        content=ft.Row(
            controls=[
                ft.IconButton(ft.Icons.HOME, icon_color="#006A6A", icon_size=32),
                ft.IconButton(
                    ft.Icons.ACCOUNT_BOX,
                    icon_color="#006A6A",
                    icon_size=32,
                ),
            ],
            alignment=ft.MainAxisAlignment.SPACE_BETWEEN,
        ),
        bgcolor=ft.Colors.WHITE,
        border_radius=42,
        shape=ft.CircularRectangleNotchShape(),
        # To make the bottom bar flay in the bottom of the screen
        margin=ft.Margin.only(left=40, right=40, bottom=28),
        padding=ft.Padding.only(left=14, right=14, top=10),
        height=70,
        # notch_margin=20
    )
    page.floating_action_button = ft.FloatingActionButton(
        icon=ft.Icons.ADD,
        shape=ft.CircleBorder(),
        bgcolor="#006A6A",
        on_click=lambda _: print("Floating"),
        elevation=3,
    )
    page.floating_action_button_location = ft.FloatingActionButtonLocation.CENTER_DOCKED

    page.add(ft.SafeArea(content=ft.Column(controls=[ft.Container(expand=True)])))


if __name__ == "__main__":
    ft.run(main)
To reproduce
  1. Execute the provided Flet mini-example code sample.
Expected behavior

Developers should be able to cleanly handle notches on floating navigation elements. There should be a built-in mechanism inside Flet's NotchShape
or AutomaticNotchShape bindings to specify raw alignment translation offsets (e.g., properties like dx_offset and dy_offset), allowing the framework to execute a coordinate shift on the guest rect bounds (guest.shift(Offset(dx, dy))) before committing to the layout path generation.

Screenshots / Videos
Captures Image Image
Operating System

Linux

Operating system details

Ubuntu 24 and Android 16

Flet version

1.0.4

Regression

I'm not sure / I don't know

Suggestions

Expose offset adjustment arguments within Flet's notch configuration bindings. Under the hood in the Flutter engine wrapper, these values should translate to shifting the layout rect math properties before calculating the shape path:

// Suggestion for Flutter side handler logic:
final Rect adjustedGuest = guest.shift(Offset(dxOffset, dyOffset));
Logs
Logs 
[Paste your logs here]
Additional details

No response

主要言語
Python
スター
17.4k
フォーク
728
平均マージ
1日 8時間
マージ済み PR（30日）
54

環境構築

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

flet-dev/flet のほかの issue

flet-dev/flet の issue をすべて見る

似ている issue

Python の issue をもっと見る

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。