Skip to content

[a11y] With maximum accessibility font size, action buttons in AlertDialogs cause rendering overflow exceptions #42696

Closed

Description

@jkurtw

b/142592672

  1. On iOS, go to Settings -> General -> Accessibility -> Larger Text and set to maximum.

  2. Observe dialogs with actions can have rendering exceptions.

Full repro code:

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(primarySwatch: Colors.blue),
      home: Scaffold(
        appBar: AppBar(title: Text('Alert Dialog Test')),
        body: Builder(
          builder: (context) => Center(
            child: RaisedButton(
              child: Text('Show Alert'),
              onPressed: () {
                showDialog(
                  context: context,
                  builder: (context) {
                    return AlertDialog(
                      title: Text('Alert Dialog'),
                      content: Text('Alert text'),
                      actions: [
                        FlatButton(onPressed: () {}, child: Text('Decline')),
                        FlatButton(onPressed: () {}, child: Text('Accept')),
                      ],
                    );
                  },
                );
              },
            ),
          ),
        ),
      ),
    );
  }
}

(We would like the text to show up fully, and we we would like them to be stacked vertically if they do not fit).

Activity

  1. added
    p: material_uimaterial_ui package in flutter/packages
    frameworkflutter/packages/flutter repository. See also f: labels.
    on Oct 15, 2019
  2. added
    a: accessibilityAccessibility, e.g. VoiceOver or TalkBack. (aka a11y)
    on Oct 15, 2019
  3. self-assigned this
    on Oct 16, 2019
  4. Hixie commented on Oct 29, 2019

    @Hixie
    Contributor

    This has been fixed!

  5. shihaohong commented on Nov 7, 2019

    @shihaohong
    Contributor

    Since #43226 was reverted, part of the problem has come back and we will need to re-design a solution that is less of a breaking change.

  6. modified the milestones: October 2019, on Nov 13, 2019
  7. modified the milestones: , November 2019 on Nov 13, 2019
  8. modified the milestones: November 2019, on Dec 11, 2019
  9. modified the milestones: , February 2020 on Dec 12, 2019
  10. shihaohong commented on Feb 19, 2020

    @shihaohong
    Contributor

    Just posting an update here that I'm still actively working on this issue. It's been taking a long time due to unforeseen breaking changes and test failures in google3 that required fixes to the upstream framework before I could proceed:

    1. Step 2 of 4: AboutDialog uses scrollable AlertDialog #49913 - Scrollable AlertDialog in AboutDialog
    2. AlertDialog.actionsOverflowButtonSpacing and ButtonBar.overflowButtonSpacing #50609 - actionsOverflowButtonSpacing to add vertical space in between buttons in an overflow case
    3. ButtonBar.verticalDirection and AlertDialog.actionsVerticalDirection #48728 - actionsVerticalDirection to flip the vertical direction of the buttons when they lay out in an overflow case

    Once these changes have been rolled into google3, I can continue with the migration

  11. shihaohong commented on Mar 4, 2020

    @shihaohong
    Contributor

    The behavior in the repro code has already been fixed, so I'll now close the issue

  12. github-actions commented on Aug 22, 2021

    @github-actions

    This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of flutter doctor -v and a minimal reproduction of the issue.

  13. locked as resolved and limited conversation to collaborators on Aug 22, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

Labels

a: accessibilityAccessibility, e.g. VoiceOver or TalkBack. (aka a11y)customer: money (g3)frameworkflutter/packages/flutter repository. See also f: labels.p: material_uimaterial_ui package in flutter/packages

Type

No type

Projects

No projects

    Milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions