Как выделить часть моего контейнера в flutter?

#flutter #dart

#flutter #dart

Вопрос:

Мне нужно выделить часть моего контейнера. Часть над красной линией должна быть темно-синей.Пожалуйста, помогите мне. https://i.stack.imgur.com/1hA2y.png

 Container(
                                decoration: BoxDecoration(
                                    borderRadius: BorderRadius.circular(30),
                                    color: Colors.lightBlue[200]),
                                height: 350,
                                child: Column(
                                  children: [
                                    Row(
                                        mainAxisAlignment:
                                            MainAxisAlignment.center,
                                        children: [
                                          _getHomework(1, index),
                                          Padding(
                                              padding:
                                                  const EdgeInsets.all(10)),
                                        ])
                                  ],
                                ),
                              )
 

Ответ №1:

Используйте Stack виджет, чтобы укладывать несколько виджетов друг на друга

 class Example extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Stack(
      overflow: Overflow.clip,
      children: [
        Container(
            decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(30),
                color: Colors.lightBlue[200]),
            child: SizedBox(
              height: 350,
              width: 350,
              child: Text('Test'),
            )),
        Divider(
          color: Colors.red,
          thickness: 2,
        )
      ],
    );
  }
}
 

Ответ №2:

Я думаю, вы ищете следующую строку.

введите описание изображения здесь

       Container(
        height: MediaQuery.of(context).size.height / 2,
        decoration: BoxDecoration(
            borderRadius: BorderRadius.circular(30),
            color: Colors.red),
        child: Column(
          children: [
            Container(
              height: 50,
              child: Center(
                child: Text("Text"),
              )
            ),
            Expanded(
              child: Container(
                decoration: BoxDecoration(
                    borderRadius: BorderRadius.only(
                        bottomLeft: Radius.circular(30),
                        bottomRight: Radius.circular(30)),
                    color: Colors.lightBlue[500]),
              ),
            )
          ],
        ))