Home > Software engineering >  Detecting and dealing with increased screen size via accessibility
Detecting and dealing with increased screen size via accessibility

Time:08-05

my app user base is of an older age group and I'm having some issues when they have increased the screen size via accessibility options.

I'm going to guess Apple doesn't allow you to override this in your app? I'd rather them squint than think the app is useless because a 1/4 of the UI is off screen!

Failing that is there a way to detect it and at least pop a dialog to warn them?

Using Flutter.

CodePudding user response:

This is an "Accessibility" (a11y) topic.

Indeed, you can't override screen zoom settings in Apple devices. You can override some settings for Android though (through MediaQuery you should be able to set textScaleFactor).

But this makes sense: we can't just ignore the needs of visually impaired users. We should build apps and UIs that react to such settings without overflowing, even though the Layout worsen a bit.

When it comes to a11y, you don't necessarily need to re-think the whole layout as responsive (Layout Builders, etc.), but you should make your text containers flexible. For example, say you have:

Row(
  children: [
    Text("Hello a11y!"),
  ],
),

then, you should consider wrapping your Text in a Flexible container to avoid Overflow (so that your text can go down to a new line).

CodePudding user response:

You can override default system scaling if you absolutely have to via:

return MaterialApp(
  builder: (context, child) => MediaQuery(
    // or whatever `textScaleFactor` you want
    data: MediaQuery.of(context).copyWith(textScaleFactor: 1.0)
    child: child ?? SizedBox.shrink(),
  ),

  // ... the rest of your MaterialApp setup
);

... but you shouldn't, ESPECIALLY given your target audience are visually impaired and you should instead be fixing your app and accommodating responsive UI to handle such use cases.

  • Related