Как разделить виджеты Flutter на отдельные узлы в семантике дерева - PullRequest
0 голосов
/ 08 апреля 2020

Я создал собственный виджет для представления плитки в ListView, пример которого приведен ниже. Плитка содержит Inkwell, так что ее можно нажать. Плитка также содержит MaterialButton. Я все обернул в Semantics соответственно, но всякий раз, когда Talkback включен, и я нажимаю на плитку, вся плитка подсвечивается. Это делает невозможным нажатие кнопки внутри.

Как мне обработать каждый Widget как отдельный узел в дереве Semantics? Документация MergeSemantics (https://api.flutter.dev/flutter/widgets/MergeSemantics-class.html), по-видимому, подразумевает, что с Widgets следует обращаться индивидуально, если они не заключены в MergeSemantics.

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: ListView(
          children: [Tile()],
        ),
      ),
    );
  }
}

class Tile extends StatelessWidget {
  @override
  Widget build(BuildContext context) => Padding(
        padding: EdgeInsets.only(top: 12),
        child: InkWell(
          onTap: () => print('Tile tapped'),
          child: _tile(),
        ),
      );

  Widget _tile() => Container(
        padding: EdgeInsets.all(12),
        decoration: BoxDecoration(
          borderRadius: BorderRadius.all(Radius.circular(5)),
          border: Border.all(color: Colors.grey, width: 1),
          shape: BoxShape.rectangle,
        ),
        child: Row(
          children: [
            _textAndCount(),
            SizedBox(width: 12),
            _button(),
          ],
        ),
      );

  Widget _textAndCount() => Expanded(
        child: Column(
          children: [
            SizedBox(
              width: double.infinity,
              child: _text(),
            ),
            _count(),
          ],
        ),
      );

  Widget _text() => Text(
        'text',
        overflow: TextOverflow.ellipsis,
        maxLines: 2,
        textAlign: TextAlign.start,
      );

  Widget _count() =>
      Padding(
        padding: EdgeInsets.only(top: 12),
        child: Row(
          children: [
            Semantics(
              label: '0 things',
              child: ExcludeSemantics(
                child: Container(
                  padding: EdgeInsets.symmetric(horizontal: 12),
                  decoration: BoxDecoration(
                    shape: BoxShape.rectangle,
                    color: Colors.grey,
                    borderRadius: BorderRadius.circular(10),
                  ),
                  child: Text('0'),
                ),
              ),
            ),
          ],
        ),
      );

  Widget _button() => Semantics(
        label: 'button',
        button: true,
        child: Tooltip(
          message: 'button',
          excludeFromSemantics: true,
          child: ExcludeSemantics(
            child: MaterialButton(
              onPressed: () => print('Button tapped'),
              child: Container(
                child: SizedBox(
                  height: 44,
                  width: 44,
                  child: Icon(Icons.add),
                ),
                decoration: BoxDecoration(
                  border: Border.all(color: Colors.grey, width: 2),
                  shape: BoxShape.circle,
                ),
              ),
            ),
          ),
        ),
      );
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...