bdlukaa / fluent_ui

Implements Microsoft's WinUI3 in Flutter.
https://bdlukaa.github.io/fluent_ui/
BSD 3-Clause "New" or "Revised" License
2.93k stars 457 forks source link

PaneitemExpander🐛 #813

Closed longfit closed 1 year ago

longfit commented 1 year ago

Fluent_u 4.5.0 and android platform

I have clicked paneitemExpander and throw as below

@pragma("vm:external-name", "AssertionError_throwNew") external static _doThrowNew( int assertionStart, int assertionEnd, Object? message);

continue debugger shown @patch @pragma("vm:external-name", "Error_throwWithStackTrace") external static Never _throw(Object error, StackTrace stackTrace);

Although it can run but abnormal paneitemExander expanding at android platform. ios seems working properly

thanks

bdlukaa commented 1 year ago

That stacktrace is not helpful. Please provide a valid stacktrace and a reproducible sample

longfit commented 1 year ago

My Case: platform android 30 modified fluent_ui Example paneItemExpander

I have modified example and add paneItem Expander at menu item and I can work show menu item, I tap the paneitemExpander debugger shown error :

/// Makes sure the controller is attached to a [FlyoutTarget]. Usually used /// when [_attachState] is necessary void _ensureAttached() { assert(isAttached, 'This controller must be attached to a FlyoutTarget'); } and then debugger stay at

@patch @pragma("vm:external-name", "Error_throwWithStackTrace") external static Never _throw(Object error, StackTrace stackTrace); }

final List originalItems = [ PaneItem( key: const Key('/'), icon: const Icon(FluentIcons.home), title: const Text('Home'), body: const SizedBox.shrink(), onTap: () { if (router.location != '/') router.pushNamed('home'); }, ), *_**_PaneItemExpander( onTap:(){ if (kDebugMode) { print ('Expander'); }

     }
      ,
    icon: const Icon(FluentIcons.expand_menu),
    title: const Text('Group',
        style: TextStyle(fontSize:18,color: Color.fromARGB(255, 1, 1, 255)),
        ),
    // infoBadge: const InfoBadge(source: Text('8')),
    body:  ScaffoldPage.withPadding(
  header: const PageHeader(title: Text('This is a header text')),
  content:  const SizedBox.shrink(),

),
 items: [
      PaneItem(
        key: const Key('/dr/drTreatment'),
        icon: const Icon(FluentIcons.medical_care),
        title: const Text('辨證施治'),
        body: const SizedBox.shrink(),
        onTap: () {
          if (router.location != '/dr/drTreatment') {
            router.pushNamed('drTreatment');
          }
        },
      ),
      PaneItem(
        icon: const Icon(FluentIcons.history),
        title: const Text('病歷記錄'),
        body: const SizedBox.shrink(),
      ),

],

PaneItemHeader(header: const Text('Inputs')),
PaneItem(
  key: const Key('/inputs/buttons'),
  icon: const Icon(FluentIcons.button_control),
  title: const Text('Button'),
  body: const SizedBox.shrink(),
  onTap: () {
    if (router.location != '/inputs/buttons') {
      router.pushNamed('inputs_buttons');
    }
  },
longfit commented 1 year ago

I have added PaneItemExpander code at example .

Linux work properly ios work properly windows work properly android error shown Only Android Platform shown below error when expand the PaneItem

Exception has occurred. _AssertionError ('package:fluent_ui/src/controls/flyouts/flyout.dart': Failed assertion: line 474 pos 12: 'isAttached': This controller must be attached to a FlyoutTarget)

========================================================= add PaneItemExpander at list of item

final List originalItems = [ PaneItem( key: const Key('/'), icon: const Icon(FluentIcons.home), title: const Text('Home'), body: const SizedBox.shrink(), onTap: () { if (router.location != '/') router.pushNamed('home'); }, ),

PaneItemExpander( onTap:(){ if (kDebugMode) { print ('Expander'); }

     }
      ,
    icon: const Icon(FluentIcons.expand_menu),
    title: const Text('應診',
        style: TextStyle(fontSize:18,color: Color.fromARGB(255, 1, 1, 255)),
        ),
    // infoBadge: const InfoBadge(source: Text('8')),
    body:  ScaffoldPage.withPadding(
  header: const PageHeader(title: Text('This is a header text')),
  content:  const SizedBox.shrink(),

),
    items: [
      PaneItem(
       key: const Key('/forms/text_box'),
        icon: const Icon(FluentIcons.medical_care),
        title: const Text('辨證施治'),
        body: const SizedBox.shrink(),
        onTap: () {

    if (router.location != '/forms/text_box') {
      router.pushNamed('forms_text_box');
    }

          // if (router.location != '/dr/drTreatment') {
          //   router.pushNamed('drTreatment');
          // }
        },
      ),
      PaneItem(
        icon: const Icon(FluentIcons.history),
        title: const Text('病歷記錄'),
        body: const SizedBox.shrink(),
      ),
      PaneItem(
        key: const Key('/basic/vendors'),
        icon: const Icon(FluentIcons.diet_plan_notebook),
        title: const Text('翻煎處方'),
        body: const SizedBox.shrink(),
        onTap: () {
          if (router.location != '/basic/vendors') {
            router.pushNamed('vendors');
          }
        },
      ),
      PaneItem(
        icon: const Icon(FluentIcons.care_plan),
        title: const Text('常用處方'),
        body: const SizedBox.shrink(),
      ),
    ]),

//醫師專用

PaneItemHeader(header: const Text('Inputs')),
PaneItem(
  key: const Key('/inputs/buttons'),
  icon: const Icon(FluentIcons.button_control),
  title: const Text('Button'),
  body: const SizedBox.shrink(),
  onTap: () {
    if (router.location != '/inputs/buttons') {
      router.pushNamed('inputs_buttons');
    }
  },
),
........
........

]

bdlukaa commented 1 year ago

Sorry, I can not reproduce this issue :/

@WinXaito could you have a look?

longfit commented 1 year ago

Sorry, I can not reproduce this issue :/

@WinXaito could you have a look?

debugger shown error:

I found my onTap event page Call caused which http server not working ...

Hence , error shown @pragma("vm:external-name", "AssertionError_throwNew") external static _doThrowNew( int assertionStart, int assertionEnd, Object? message);

thanks

longfit commented 1 year ago

I have added PaneItemExpander code at example .

Linux work properly ios work properly windows work properly android error shown

you can see previously modified example

thanks

longfit commented 1 year ago

I created PaneItemExpander for android Platform .

android platform caused error throw when I click PaneItemExpander

I have added PaneItemExpander in your example and

attached simple code for PaneItemExpander.

The error throw same , where I can miss use the PaneItemExpander

//=========================================================================================

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

import 'package:fluent_ui/fluent_ui.dart'; import 'package:flutter/foundation.dart';

void main() { runApp(const MyApp()); }

class MyApp extends StatelessWidget { const MyApp({super.key});

// This widget is the root of your application. @override Widget build(BuildContext context) { return FluentApp( title: 'Flutter Demo', theme: FluentThemeData( scaffoldBackgroundColor: Colors.white, accentColor: Colors.blue, iconTheme: const IconThemeData(size: 24)), darkTheme: FluentThemeData( scaffoldBackgroundColor: Colors.black, accentColor: Colors.blue, iconTheme: const IconThemeData(size: 24)), home: const MyHome(), ); } }

class MyHome extends StatefulWidget { const MyHome({super.key});

@override State createState() => _MyHomeState(); }

class _MyHomeState extends State { final List originalItems = [ PaneItem( key: const Key('/'), icon: const Icon(FluentIcons.home), title: const Text('主頁 1', style: TextStyle(fontSize: 22)), body: const SizedBox.shrink(), onTap: () { // if (router.location != '/') router.pushNamed('home'); }, ), ];

@override Widget build(BuildContext context) { return NavigationView( appBar: const NavigationAppBar(title: Text("長順 apps")), // content: ScaffoldPage.scrollable(children:[ // Container() // ]), pane: NavigationPane( selected: 0, header: const Text('menu H'), displayMode: PaneDisplayMode.auto, items: [ PaneItemSeparator(color: const Color.fromARGB(255, 132, 129, 129)), // ** 醫師功能 PaneItemHeader(header: const Text('醫師功能')), PaneItemExpander( onTap: () { if (kDebugMode) { print('Expander'); } }, icon: const Icon(FluentIcons.expand_menu), title: const Text('應診'), // infoBadge: const InfoBadge(source: Text('8')), // body: ScaffoldPage.withPadding( // header: // const PageHeader(title: Text('This is a header text')), // content: const SizedBox.shrink(), // ), body:const _NavigationBodyItem( header: 'PaneItemExpander', content: Text( 'Some apps may have a more complex hierarchical structure ' 'that requires more than just a flat list of navigation ' 'items. You may want to use top-level navigation items to ' 'display categories of pages, with children items displaying ' 'specific pages. It is also useful if you have hub-style ' 'pages that only link to other pages. For these kinds of ' 'cases, you should create a hierarchical NavigationView.', ), ), items: [ PaneItem( key: const Key('/dr/drTreatment'), icon: const Icon(FluentIcons.medical_care), title: const Text('treatment'), body: const SizedBox.shrink(), onTap: () { if (kDebugMode) { print('treatment'); }

                },
              ),
            //   PaneItem(
            //     icon: const Icon(FluentIcons.history),
            //     title: const Text('病歷記錄'),
            //     body: const SizedBox.shrink(),
            //   ),
            //   PaneItem(
            //     key: const Key('/basic/vendors'),
            //     icon: const Icon(FluentIcons.diet_plan_notebook),
            //     title: const Text('翻煎處方'),
            //     body: const SizedBox.shrink(),
            //     onTap: () {
            //       // if (router.location != '/basic/vendors') {
            //       //   router.pushNamed('vendors');
            //       // }
            //     },
            //   ),
            //   PaneItem(
            //     icon: const Icon(FluentIcons.care_plan),
            //     title: const Text('常用處方'),
            //     body: const SizedBox.shrink(),
            //   ),
            ]
            ),

        PaneItemHeader(header: const Text('Item Header')),
        PaneItem(
          icon: const Icon(FluentIcons.home),
          title: const Text("Home"),
          // body: const SizedBox.shrink(),
          body: ScaffoldPage.withPadding(
              header:
                  const PageHeader(title: Text('This is a header text')),
              content: const SizedBox.shrink(),
            ),
        ),
        PaneItem(
            icon: const Icon(FluentIcons.home),
            title: const Text("Insert"),
            body: const SizedBox.shrink()),
        PaneItem(
            icon: const Icon(FluentIcons.home),
            title: const Text("Print"),
            body: const SizedBox.shrink())
      ]

      ),
);

} }

// displayMode: PaneDisplayMode.auto,

  //   items: [
  //   PaneItem(
  //     icon: const Icon(FluentIcons.home),
  //     title: const Text("Home"),
  //     body: const SizedBox.shrink(),
  //   ),
  //   PaneItem(
  //       icon: const Icon(FluentIcons.home),
  //       title: const Text("Insert"),
  //       body: const SizedBox.shrink()),
  //   PaneItem(
  //       icon: const Icon(FluentIcons.home),
  //       title: const Text("Print"),
  //       body: const SizedBox.shrink())
//  ]

class _NavigationBodyItem extends StatelessWidget { const _NavigationBodyItem({ Key? key, this.header, this.content, }) : super(key: key);

final String? header; final Widget? content;

@override Widget build(BuildContext context) { return ScaffoldPage.withPadding( header: PageHeader(title: Text(header ?? 'This is a header text')), content: content ?? const SizedBox.shrink(), ); } }

WinXaito commented 1 year ago

@WinXaito could you have a look?

I'm sorry, I don't have an Android.


@longfit can you format correctly your code ?

You can do that like that:

\```dart
class _NavigationBodyItem extends StatelessWidget {
    const _NavigationBodyItem({...})
   ... 
}
\```

(Remove the backslash)

bdlukaa commented 1 year ago

Only Android Platform shown below error when expand the PaneItem

Exception has occurred. _AssertionError ('package:fluent_ui/src/controls/flyouts/flyout.dart': Failed assertion: line 474 pos 12: 'isAttached': This controller must be attached to a FlyoutTarget)

This is not valid, since the pane item doesn't make use of flyouts. #821 should fix this