привязать дочерний элемент к дочернему элементу в Stack

Question

Как привязать дочерний элемент к дочернему элементу в Stack? Сделать аналогично ConstraintLayout. КАК ПРИВЯЗАТЬ ВИДЖЕТ С ТЕКСТОМ 1 К ВИДЖЕТУ С ТЕКСТОМ 2? Возможно ли такое? Сейчас дочерние виджеты привязаны к сторонам родительского виджета Stack. Спасибо.

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
 @override
 Widget build(BuildContext context) {
  return MaterialApp(
   debugShowCheckedModeBanner: false,
   home: Scaffold(
    appBar: AppBar(),
    body: Stack(
     children: <Widget>[
      Positioned(
       top: 0,
       child: Container(
        width: 100,
        height: 100,
        color: Colors.red,
        alignment: Alignment.center,
        child: Text(
         '1',
         textAlign: TextAlign.center,
         style: TextStyle(
         color: Colors.white,
         fontSize: 22,
         ),
        ),
       ),
      ),
      Positioned(
       right: 0,
       child: Container(
        width: 100,
        height: 100,
        color: Colors.green,
        alignment: Alignment.center,
        child: Text(
         '2',
         textAlign: TextAlign.center,
         style: TextStyle(
         color: Colors.white,
         fontSize: 22,
         ),
        ),
       ),
      ),
      //КАК ПРИВЯЗАТЬ ВИДЖЕТ С ТЕКСТОМ 1 К ВИДЖЕТУ С ТЕКСТОМ 2
      Positioned(
       right: 0,
       bottom: 0,
       child: Container(
        width: 100,
        height: 100,
        color: Colors.blue,
        alignment: Alignment.center,
        child: Text(
         '3',
         textAlign: TextAlign.center,
         style: TextStyle(
          color: Colors.white,
          fontSize: 22,
         ),
        ),
       ),
      ),
     ],
    ),
   )
  );
 }
}

Answer 1

Вот так можно (На самом деле есть несколько возможностей этого добиться, например через LayoutBuilder. Вот несколько статей на эту тему: Basic layout concepts, Layout Cheat Sheet):

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        appBar: AppBar(),
        body: Stack(
          children: <Widget>[
            Positioned(
              top: 0,
              child: Row(
                children: <Widget>[
                  Container(
                    width: 100,
                    height: 100,
                    color: Colors.red,
                    alignment: Alignment.center,
                    child: Text(
                      '1',
                      textAlign: TextAlign.center,
                      style: TextStyle(
                        color: Colors.white,
                        fontSize: 22,
                      ),
                    ),
                  ),
                  Container(
                    width: 100,
                    height: 100,
                    color: Colors.green,
                    alignment: Alignment.center,
                    child: Text(
                      '2',
                      textAlign: TextAlign.center,
                      style: TextStyle(
                        color: Colors.white,
                        fontSize: 22,
                      ),
                    ),
                  ),
                ],
              ),
            ),
            Positioned(
              right: 0,
              bottom: 0,
              child: Container(
                width: 100,
                height: 100,
                color: Colors.blue,
                alignment: Alignment.center,
                child: Text(
                  '3',
                  textAlign: TextAlign.center,
                  style: TextStyle(
                    color: Colors.white,
                    fontSize: 22,
                  ),
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

БЛОГ НА HUSL

привязать дочерний элемент к дочернему элементу в Stack

Ответы (1 шт):