Добавление singlechildscrollview, скрывающего все виджеты
Если я добавлю SingleChildScrollView на этот экран Flutter, все мои виджеты исчезнут. Я получаю пустой белый экран. Это мой код без прокрутки:
class _HomePageState extends State<HomePage> {
@override
Widget build(BuildContext context) {
return Scaffold(
body: Padding(
padding: const EdgeInsets.only(top: 33),
child: Stack(
alignment: AlignmentDirectional.topEnd,
children: [
Positioned(
top: 0,
right: 0,
child: Image.asset("assets/images/top_right.png"), //Icon
),
Positioned(
top: -10,
right: 0,
child: Image.asset("assets/images/profile_picture.png"),
),
Container(
margin: const EdgeInsets.all(20),
child: Column(
children: [
Container(
margin: const EdgeInsets.all(15),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
margin: const EdgeInsets.only(),
child: const Text(
"Hi,",
style: TextStyle(
fontFamily: "poppin_regular",
fontSize: 27,
color: Colors.black),
)),
Container(
margin: const EdgeInsets.only(),
child: const Text(
"Jennifer",
style: TextStyle(
fontFamily: "poppin_semibold",
fontSize: 40,
color: Colors.black),
))
],
),
],
),
),
Flexible(
child: Container(
margin: const EdgeInsets.only(),
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
Card(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(15),
),
margin: const EdgeInsets.only(top: 10),
elevation: 1,
shadowColor: Colors.black,
child: Row(
children: [
const SizedBox(
width: 305,
height: 50,
child: Padding(
padding:
EdgeInsets.only(left: 20, right: 20),
child: TextField(
keyboardType: TextInputType.multiline,
decoration: InputDecoration(
border: InputBorder.none,
hintText: "Search For Place",
hintStyle: TextStyle(
fontSize: 14,
color: Color.fromRGBO(
140, 140, 140, 100)),
),
),
), //Padding
),
Image.asset("assets/images/search.png")
],
),
),
const SizedBox(
width: double.infinity,
child: Text(
"What are you looking for",
style: TextStyle(
fontFamily: "poppin_semibold",
fontSize: 18),
)),
Container(
height: 133,
width: 345,
decoration: const BoxDecoration(
color: Color(0xffa3a3a3),
borderRadius: BorderRadius.all(
Radius.circular(10),
)),
child: InkWell(
onTap: () {},
child: Padding(
padding: const EdgeInsets.only(left: 20),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Image.asset("assets/images/Group 509.png"),
const Text(
"Request a trip",
style: TextStyle(
color: Colors.black,
fontFamily: "poppin_semibold",
fontSize: 18),
),
Row(
crossAxisAlignment:
CrossAxisAlignment.start,
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
children: [
Column(
crossAxisAlignment:
CrossAxisAlignment.start,
children: const [
Text(
"When new trip matches your travel ",
style: TextStyle(
color: Colors.black,
fontSize: 12,
fontFamily: "poppin_regular"),
),
Text(
"needs Get Notified",
style: TextStyle(
color: Colors.black,
fontSize: 12,
fontFamily: "poppin_regular"),
),
],
),
Container(
margin: const EdgeInsets.only(),
height: 71,
width: 90,
child: Image.asset(
"assets/images/Group 539.png"))
],
)
],
),
),
),
),
Container(
height: 133,
width: 345,
decoration: const BoxDecoration(
color: Color(0xffffdacb),
borderRadius: BorderRadius.all(
Radius.circular(10),
)),
child: InkWell(
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => PostYourTrip(),
));
},
child: Padding(
padding: const EdgeInsets.only(left: 20),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Image.asset("assets/images/orangedots.png"),
const Text(
"Post your trip",
style: TextStyle(
color: Colors.black,
fontFamily: "poppin_semibold",
fontSize: 18),
),
Row(
crossAxisAlignment:
CrossAxisAlignment.start,
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
children: [
Column(
children: const [
Text(
"Let others know about your plan so ",
style: TextStyle(
color: Colors.black,
fontSize: 12,
fontFamily: "poppin_regular"),
),
Text(
"they can join you on your journey ",
style: TextStyle(
color: Colors.black,
fontSize: 12,
fontFamily: "poppin_regular"),
),
],
),
Container(
margin: const EdgeInsets.only(),
height: 71,
width: 90,
child: Image.asset(
"assets/images/post_trip.png"))
],
)
],
),
),
),
),
Container(
height: 133,
width: 345,
decoration: const BoxDecoration(
color: Color(0xffbde4fe),
borderRadius: BorderRadius.all(
Radius.circular(10),
)),
child: InkWell(
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => FindTrip(),
));
},
child: Padding(
padding: const EdgeInsets.only(left: 20),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Image.asset("assets/images/bluedot.png"),
const Text(
"Find your trip",
style: TextStyle(
color: Colors.black,
fontFamily: "poppin_semibold",
fontSize: 18),
),
Row(
crossAxisAlignment:
CrossAxisAlignment.start,
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
children: [
Column(
crossAxisAlignment:
CrossAxisAlignment.start,
children: const [
Text(
"Find a ride and carpool anywhere in",
style: TextStyle(
color: Colors.black,
fontSize: 12,
fontFamily: "poppin_regular"),
),
Text(
"Pakistan",
style: TextStyle(
color: Colors.black,
fontSize: 12,
fontFamily: "poppin_regular"),
),
],
),
Container(
margin: const EdgeInsets.only(),
height: 71,
width: 90,
child: Image.asset(
"assets/images/postgroup.png"))
],
)
],
),
),
),
),
],
),
),
)
],
),
)
],
),
),
);
}
}
Если я добавлю SingleChildScrollView вверху после или перед виджетом заполнения, все виджеты исчезнут.
Пожалуйста, проверьте и предоставьте мне решение. Спасибо
в приведенном выше коде нет SingleChildScrollView, это обычно происходит из-за бесконечной высоты или ширины, занимаемой дочерним виджетом.
—
15.11.2022 12:54
Стоит ли изучать PHP в 2026-2027 годах?
Привет всем, сегодня я хочу высказать свои соображения по поводу вопроса, который я уже много раз получал в своем сообществе: "Стоит ли изучать PHP в...
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Приемы CSS-макетирования - floats и Flexbox
Здравствуйте, друзья-студенты! Готовы совершенствовать свои навыки веб-дизайна? Сегодня в нашем путешествии мы рассмотрим приемы CSS-верстки - в...
Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest
В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Пользовательский скаляр GraphQL
Листовые узлы системы типов GraphQL называются скалярами. Достигнув скалярного типа, невозможно спуститься дальше по иерархии типов. Скалярный тип...
1
2
56
2
Перейти к ответу
Данный вопрос помечен как решенный
Ответы 2
Ответ принят как подходящий
Попробуйте приведенный ниже код и замените мое сетевое изображение своим изображением актива.
Поток кода:
Padding
- Stack
- Positioned
- SingleChildScrollView
- Column
- Other Widgets
Полный код:
Padding(
padding: const EdgeInsets.only(top: 33),
child: Stack(
alignment: AlignmentDirectional.topEnd,
children: [
Positioned(
top: 0,
right: 0,
child: Image.network(
"https://upload.wikimedia.org/wikipedia/commons/1/17/Google-flutter-logo.png",
height: 20,
), //Icon
),
Positioned(
top: -10,
right: 0,
child: Image.network(
"https://upload.wikimedia.org/wikipedia/commons/1/17/Google-flutter-logo.png",
height: 20,
),
),
SingleChildScrollView(
child: Column(
children: [
Container(
margin: const EdgeInsets.all(15),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
margin: const EdgeInsets.only(),
child: const Text(
"Hi,",
style: TextStyle(
fontFamily: "poppin_regular",
fontSize: 27,
color: Colors.black),
)),
Container(
margin: const EdgeInsets.only(),
child: const Text(
"Jennifer",
style: TextStyle(
fontFamily: "poppin_semibold",
fontSize: 40,
color: Colors.black),
))
],
),
],
),
),
SizedBox(
width: MediaQuery.of(context).size.width,
height: MediaQuery.of(context).size.height,
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
Card(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(15),
),
margin: const EdgeInsets.only(top: 10),
elevation: 1,
shadowColor: Colors.black,
child: Row(
children: [
const SizedBox(
width: 305,
height: 50,
child: Padding(
padding: EdgeInsets.only(left: 20, right: 20),
child: TextField(
keyboardType: TextInputType.multiline,
decoration: InputDecoration(
border: InputBorder.none,
hintText: "Search For Place",
hintStyle: TextStyle(
fontSize: 14,
color: Color.fromRGBO(
140, 140, 140, 100)),
),
),
), //Padding
),
Image.network(
"https://upload.wikimedia.org/wikipedia/commons/1/17/Google-flutter-logo.png",
height: 20,
),
],
),
),
const SizedBox(
width: double.infinity,
child: Text(
"What are you looking for",
style: TextStyle(
fontFamily: "poppin_semibold", fontSize: 18),
)),
Container(
height: 133,
width: 345,
decoration: const BoxDecoration(
color: Color(0xffa3a3a3),
borderRadius: BorderRadius.all(
Radius.circular(10),
)),
child: InkWell(
onTap: () {},
child: Padding(
padding: const EdgeInsets.only(left: 20),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Image.network(
"https://upload.wikimedia.org/wikipedia/commons/1/17/Google-flutter-logo.png",
height: 20,
),
const Text(
"Request a trip",
style: TextStyle(
color: Colors.black,
fontFamily: "poppin_semibold",
fontSize: 18),
),
Row(
crossAxisAlignment:
CrossAxisAlignment.start,
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
children: [
Column(
crossAxisAlignment:
CrossAxisAlignment.start,
children: const [
Text(
"When new trip matches your travel ",
style: TextStyle(
color: Colors.black,
fontSize: 12,
fontFamily: "poppin_regular"),
),
Text(
"needs Get Notified",
style: TextStyle(
color: Colors.black,
fontSize: 12,
fontFamily: "poppin_regular"),
),
],
),
Container(
margin: const EdgeInsets.only(),
height: 71,
width: 90,
child: Image.network(
"https://upload.wikimedia.org/wikipedia/commons/1/17/Google-flutter-logo.png",
height: 20,
),
)
],
)
],
),
),
),
),
Container(
height: 133,
width: 345,
decoration: const BoxDecoration(
color: Color(0xffffdacb),
borderRadius: BorderRadius.all(
Radius.circular(10),
)),
child: InkWell(
onTap: () {},
child: Padding(
padding: const EdgeInsets.only(left: 20),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Image.network(
"https://upload.wikimedia.org/wikipedia/commons/1/17/Google-flutter-logo.png",
height: 20,
),
const Text(
"Post your trip",
style: TextStyle(
color: Colors.black,
fontFamily: "poppin_semibold",
fontSize: 18),
),
Row(
crossAxisAlignment:
CrossAxisAlignment.start,
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
children: [
Column(
children: const [
Text(
"Let others know about your plan so ",
style: TextStyle(
color: Colors.black,
fontSize: 12,
fontFamily: "poppin_regular"),
),
Text(
"they can join you on your journey ",
style: TextStyle(
color: Colors.black,
fontSize: 12,
fontFamily: "poppin_regular"),
),
],
),
Container(
margin: const EdgeInsets.only(),
height: 71,
width: 90,
child: Image.network(
"https://upload.wikimedia.org/wikipedia/commons/1/17/Google-flutter-logo.png",
height: 20,
),
)
],
)
],
),
),
),
),
Container(
height: 133,
width: 345,
decoration: const BoxDecoration(
color: Color(0xffbde4fe),
borderRadius: BorderRadius.all(
Radius.circular(10),
)),
child: InkWell(
onTap: () {},
child: Padding(
padding: const EdgeInsets.only(left: 20),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Image.network(
"https://upload.wikimedia.org/wikipedia/commons/1/17/Google-flutter-logo.png",
height: 20,
),
const Text(
"Find your trip",
style: TextStyle(
color: Colors.black,
fontFamily: "poppin_semibold",
fontSize: 18),
),
Row(
crossAxisAlignment:
CrossAxisAlignment.start,
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
children: [
Column(
crossAxisAlignment:
CrossAxisAlignment.start,
children: const [
Text(
"Find a ride and carpool anywhere in",
style: TextStyle(
color: Colors.black,
fontSize: 12,
fontFamily: "poppin_regular"),
),
Text(
"Pakistan",
style: TextStyle(
color: Colors.black,
fontSize: 12,
fontFamily: "poppin_regular"),
),
],
),
Container(
margin: const EdgeInsets.only(),
height: 71,
width: 90,
child: Image.network(
"https://upload.wikimedia.org/wikipedia/commons/1/17/Google-flutter-logo.png",
height: 20,
),
),
],
)
],
),
),
),
),
],
),
)
],
),
)
],
),
),
вам нужно установить некоторую фиксированную ширину и высоту, потому что вы уже пытаетесь обернуть виджет бесконечной высоты в виджет бесконечной высоты, т.е. стек -> singlechildscrollview. так что вам нужно сделать, это исправить внутреннюю высоту виджета, я поставил контейнер с шириной и высотой в качестве примера
Container(
height: MediaQuery.of(context).size.height * 0.70,
width: MediaQuery.of(context).size.width,
margin: const EdgeInsets.only(),
child: SingleChildScrollView(
child: Column( your containers here )))
Другие вопросы по теме
Воспроизведение музыки в фоновом режиме после закрытия приложения во флаттере
Flutter - Как отложить задачу хотя бы на 2 секунды, но не дольше, чем необходимо?
Найдите ближайшую дату к сегодняшнему дню из результатов API
Строка состояния скрыта, когда она возвращается в портретный режим из ландшафтного режима в проигрывателе YouTube, дрожащем при нажатии кнопки в полноэкранном режиме
Исправление типа List<dynamic>, не являющегося подтипом типа String
Flutter NFC-Manager: большинство кредитных/дебетовых карт не читаются на iOS
Flutter: как рассчитать общую стоимость списка предметов в FutureBuilder
Как выделить искомый текст другим цветом в Text in flutter
Как получить доступ к полям документа, используя идентификатор документа в Cloud FireStore?
Как преобразовать базу данных в формате JSON в реальном времени Flutter
Похожие вопросы
Воспроизведение музыки в фоновом режиме после закрытия приложения во флаттере
Flutter Animation — переворачивание карты без использования предварительно определенных пакетов
Flutter - Как отложить задачу хотя бы на 2 секунды, но не дольше, чем необходимо?
Найдите ближайшую дату к сегодняшнему дню из результатов API
Как можно использовать будущее в флаттере списка?
Строка состояния скрыта, когда она возвращается в портретный режим из ландшафтного режима в проигрывателе YouTube, дрожащем при нажатии кнопки в полноэкранном режиме
Как управлять состоянием пользовательского виджета в виджете SingleChildScrollView
Как динамически установить пользовательский звук уведомления во флаттере (только для Android)?
Исправление типа List<dynamic>, не являющегося подтипом типа String
Flutter NFC-Manager: большинство кредитных/дебетовых карт не читаются на iOS
Поделитесь кодом с виджетом SIngleChildScrollView, который вы пытаетесь применить.