#flutter #flutter-layout
#flutter #flutter-макет
Вопрос:
Я не хочу получать контурную границу двух контейнеров в стеке, один из которых расположен так, как показано на рисунке. Моя цель — удалить «красную» часть.
Как я могу выполнить это в Flutter?
Widget build(BuildContext context) {
return Stack(
overflow: Overflow.visible,
children: [
Container(
width: 200,
height: 200,
decoration: BoxDecoration(
border: Border.all(),
),
child: const Center(child: Text("BLABLABLA")),
),
Positioned(
top: -10,
left: 10,
child: Container(
width: 150,
height: 25,
decoration: BoxDecoration(
border: Border.all(),
),
child: const Center(child: Text("BLABLABL2")),
),
),
],
);
}
Комментарии:
1. Можете ли вы предоставить свой код
2. Можете ли вы опубликовать код?
3. Вам нужен вывод такой же, как на первом изображении, верно?
4. да, без красной границы.
5. @Nauzet Ты можешь опубликовать свой код?
Ответ №1:
Если я правильно понял ваш вопрос, то это сработает для вас!
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Stack Example'),
),
body: Center(
child: Stack(
overflow: Overflow.visible,
children: [
Container(
width: 200,
height: 200,
decoration: BoxDecoration(
color: Colors.grey.withOpacity(0.2),
border: Border.all(),
),
child: const Center(child: Text("BLABLABLA")),
),
Positioned(
top: -10,
left: 10,
child: Container(
width: 150,
height: 25,
decoration: BoxDecoration(
color: Colors.white,
),
child: Stack(children: [
Container(
width: double.infinity,
decoration: BoxDecoration(
border: Border(
top: BorderSide(color: Colors.black),
left: BorderSide(color: Colors.black),
right: BorderSide(color: Colors.black),
),
),
height: 11),
Center(
child: Text("BLABLABL2"),
),
],
),
),
),
],
),
),
);
}
Результат будет выглядеть,
