#flutter #dart #widget #containers #material-design
Вопрос:
import 'package:flutter/material.dart';
void main() {
runApp(MainScreen());
}
class MainScreen extends StatelessWidget {
const MainScreen({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
double width = MediaQuery.of(context).size.width;
return Scaffold(
body: Column(
children: <Widget>[
Stack(
children: [
Container(
height: 250.0,
width: width,
decoration: BoxDecoration(
borderRadius: BorderRadius.only(
bottomLeft: Radius.circular(150),
bottomRight: Radius.circular(150),
),
color: Colors.redAccent,
),
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Text(
"Hello World",
style: TextStyle(
fontSize: 22,
fontFamily: "Arial",
fontWeight: FontWeight.bold,
color: Colors.white),
),
Text(
"Hello World",
style: TextStyle(
fontSize: 22,
fontFamily: "Arial",
fontWeight: FontWeight.bold,
color: Colors.white),
),
],
),
),
),
],
),
Stack(
children: [
Positioned(
top: 40,
left: 20,
child: Container(
height: 500,
width: 200,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
color: Colors.grey,
),
),
),
],
),
],
),
);
}
}
Я попытался добавить новый контейнер на основе той же строки, но не смог найти, как сложить с другим контейнером, использующим виджет позиционирования для второго контейнера, но это не сработало. в конце концов, сделал первый контейнер таким же, как и второй контейнер, используя стек, и позиционированный виджет все еще не сработал
Я попытался добавить новый контейнер на основе той же строки, но не смог найти, как сложить с другим контейнером, использующим виджет позиционирования для второго контейнера, но это не сработало. в конце концов, сделал первый контейнер таким же, как и второй контейнер, используя стек, и позиционированный виджет все еще не сработал
Я загрузил картинку, которая содержит два контейнера вместе, но не стопку только внизу. Спасибо.
Комментарии:
1. Загрузите или укажите изображение виджета цели, которое вы хотите, чтобы мы знали, как вам помочь
Ответ №1:
Если вы хотите поместить два контейнера в стопку, вам не нужно создавать две стопки. Вам просто нужно сложить два контейнера в стопку и завернуть один из них в бумагу. Подобный этому:
import 'package:flutter/material.dart';
void main() {
runApp(MainScreen());
}
class MainScreen extends StatelessWidget {
const MainScreen({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
double width = MediaQuery.of(context).size.width;
return Scaffold(
body: Stack(
children: [
Container(
height: 250.0,
width: width,
decoration: BoxDecoration(
borderRadius: BorderRadius.only(
bottomLeft: Radius.circular(150),
bottomRight: Radius.circular(150),
),
color: Colors.redAccent,
),
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Text(
"Hello World",
style: TextStyle(
fontSize: 22,
fontFamily: "Arial",
fontWeight: FontWeight.bold,
color: Colors.white),
),
Text(
"Hello World",
style: TextStyle(
fontSize: 22,
fontFamily: "Arial",
fontWeight: FontWeight.bold,
color: Colors.white),
),
],
),
),
),
Positioned(
top: 40,
left: 20,
child: Container(
height: 500,
width: 200,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
color: Colors.grey,
),
),
),
],
),
);
}
}