SelectableRegion setState selection lost

Question

In the following example I have a SelectableRegion containing a list of text widgets and I call setState() every second. If I remove 'SelectionContainer.disabled' in 'TextWidget' then the selection state survives setState, otherwise it loses the text selection. Can you please why this issue happens and how to properly fix it?

import 'dart:async';
import 'package:flutter/material.dart';
import 'package:lets_hang/locations/map_text_selection.dart';
import 'dart:math' as math;

class SelectionTest extends StatefulWidget {
  const SelectionTest({Key? key}) : super(key: key);

  @override
  State<SelectionTest> createState() => _SelectionTestState();
}

class _SelectionTestState extends State<SelectionTest> {
  final _selectableRegionFocusNode = FocusNode();
  late final Timer _timer;
  var count = 1;

  @override
  void initState() {
    super.initState();
    _timer = Timer.periodic(const Duration(milliseconds: 1500), (timer) {
      count++;
      setState(() {});
    });
  }

  @override
  dispose() {
    _selectableRegionFocusNode.dispose();
    _timer.cancel();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return SelectableRegion(
      selectionControls: MapTextSelectionControls(),
      focusNode: _selectableRegionFocusNode,
      child: Container(
        width: 200,
        height: 300,
        color: Color((math.Random().nextDouble() * 0xFFFFFF).toInt())
            .withOpacity(1.0),
        child: ListView.builder(
          itemBuilder: (context, index) => TextWidget(key: ValueKey(index)),
          itemCount: count,
        ),
      ),
    );
  }
}

class TextWidget extends StatelessWidget {
  const TextWidget({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    final textSpans = <InlineSpan>[
      const TextSpan(text: 'Hey 123 456 789'),
      WidgetSpan(
        child: SelectionContainer.disabled(
          child: Text(
            '-> No issue if I remove SelectionContainer.disabled <-',
            maxLines: 1,
            style: Theme.of(context)
                .textTheme
                .bodyMedium!
                .copyWith(color: Colors.transparent),
          ),
        ),
      ),
    ];

    return Text.rich(TextSpan(children: textSpans));
  }
}

could you provide a mvp showing only the problem you have where i can take the code to test it out? Fixing it with the provided code is really specific and difficult. you could also put the code in a github repo so that can i take a look — Marcel Dz, Mar 29 '23 at 21:13
@MarcelDz I have provided a completely distilled full example that you can copy paste. — user123, Apr 01 '23 at 15:11

score 1 · Answer 1 · answered Mar 26 '23 at 17:43

1

There is a solution , that is you will take the chat bubble and put it in a stateless or statefull class . then call it in your current class and before it add const .

answered Mar 26 '23 at 17:43

Abdelaziz HADIAT ALLAH

360
1
4
11

score 1 · Answer 2 · answered Mar 26 '23 at 18:26

1

Without some more code is really difficult to know, but assuming that what you can try to wrap with a StatefulBuilder the widget that throws the setState and isolate it with it.

answered Mar 26 '23 at 18:26

Gse

66
4

I added code to show the difficulty of insulating it from setState – user123 Mar 27 '23 at 06:47
As it’s currently written, your answer is unclear. Please [edit] to add additional details that will help others understand how this addresses the question asked. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Hamed Apr 02 '23 at 04:39
@Hamed I edited the answer to make it clearer and easier – user123 Apr 02 '23 at 16:48

SelectableRegion setState selection lost

2 Answers2