How to change length of connecting line?

[SardorbekR]

I want to change length of this line and I could not find property for this

[JHBitencourt]

Hey @SardorbekR, sorry for the late reply and thanks for the issue.

You must control the length of this line with the size of the children. In your example, you can see that the text determined the length of each tile.

So, if you want a fixed size, or at least give it a dynamic size with a minimum/maximum width, you should use a BoxConstraints at the child:

TimelineTile(
  ...
  endChild: Container(
    constraints: const BoxConstraints(
      minWidth: 80,
      maxWidth: 80,
    ),
    child: const Text('Your child'),
  ),
),

Full code:

```dart Scaffold( body: Column( mainAxisAlignment: MainAxisAlignment.center, children: [ const Text('Text controls the size:'), const SizedBox(height: 20), Container( height: 100, child: Row( crossAxisAlignment: CrossAxisAlignment.stretch, mainAxisAlignment: MainAxisAlignment.center, children: [ TimelineTile( axis: TimelineAxis.horizontal, alignment: TimelineAlign.manual, isFirst: true, lineXY: 0.1, indicatorStyle: const IndicatorStyle(indicatorXY: 0.1), endChild: Container( color: Colors.lightGreenAccent, child: const Text('My text'), ), ), TimelineTile( axis: TimelineAxis.horizontal, alignment: TimelineAlign.manual, lineXY: 0.1, endChild: Container( color: Colors.lime, child: const Text('A bigger text in the middle'), ), ), TimelineTile( axis: TimelineAxis.horizontal, alignment: TimelineAlign.manual, isLast: true, lineXY: 0.1, indicatorStyle: const IndicatorStyle(indicatorXY: 0.9), endChild: Container( color: Colors.lightBlueAccent, child: const Text('Other text'), ), ), ], ), ), const SizedBox(height: 20), const Text('Size controlled by constraints:'), const SizedBox(height: 20), Container( height: 100, child: Row( crossAxisAlignment: CrossAxisAlignment.stretch, mainAxisAlignment: MainAxisAlignment.center, children: [ TimelineTile( axis: TimelineAxis.horizontal, alignment: TimelineAlign.manual, isFirst: true, lineXY: 0.1, indicatorStyle: const IndicatorStyle(indicatorXY: 0.1), endChild: Container( constraints: const BoxConstraints( minWidth: 80, maxWidth: 80, ), color: Colors.lightGreenAccent, child: const Text('My text'), ), ), TimelineTile( axis: TimelineAxis.horizontal, alignment: TimelineAlign.manual, lineXY: 0.1, endChild: Container( constraints: const BoxConstraints( minWidth: 80, maxWidth: 80, ), color: Colors.lime, child: const Text('A bigger text in the middle'), ), ), TimelineTile( axis: TimelineAxis.horizontal, alignment: TimelineAlign.manual, isLast: true, lineXY: 0.1, indicatorStyle: const IndicatorStyle(indicatorXY: 0.9), endChild: Container( constraints: const BoxConstraints( minWidth: 80, maxWidth: 80, ), color: Colors.lightBlueAccent, child: const Text('Other text'), ), ), ], ), ), ], ), ); ```

Let me know if this helped you.