QuickTech Ramjan
QuickTech Ramjan

Reputation: 21

How can I expand this Stack Widget?

here I am face a issue in Stack Widget. When I am give height width then The scaffold is scrolled. When I am remove the height Scaffold not scrolled. But in body I give

SingleChildScrollView().

..

I hope, Here I found my solution. Thanks......................................

This is custom Container Widget:

import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:hexcolor/hexcolor.dart';

Widget customContainerWidget({
  required Widget child,
  double? height,
  Color? color,
  BorderRadiusGeometry? borderRadius,
}) {
  return Container(
    // height: height,
    width: Get.width,
    decoration: BoxDecoration(
      color: color != null ? color : HexColor('#FFE58F'),
      borderRadius:
          borderRadius != null ? borderRadius : BorderRadius.circular(40),
      boxShadow: [
        BoxShadow(
          color: Colors.grey,
          blurRadius: 120,
          spreadRadius: .10,
          offset: Offset(1, 20),
        ),
      ],
    ),
    child: ListView(
      shrinkWrap: true,
      primary: false,
      children: [child],
    ),
  );
}

This is my page Widget :

    import 'package:Darucheeni/src/controllers/mainController/baseController.dart';
    import 'package:flutter/material.dart';
    import 'package:get/get.dart';
    import 'package:Darucheeni/src/configs/appColors.dart';
    import 'package:Darucheeni/src/configs/appConfigs.dart';
    import 'package:Darucheeni/src/widgets/button/customBackButton.dart';
    import 'package:Darucheeni/src/widgets/ConatinerWidget/customBorderContainer.dart';
    import 'package:Darucheeni/src/widgets/ConatinerWidget/customContainerWidget.dart';
    import 'package:Darucheeni/src/widgets/textWidget/kText.dart';
    
    class AcceptOrderPage extends StatelessWidget with BaseController {
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          body: SingleChildScrollView(
            child: Column(
              children: [
                sizeH20,
                Container(
  //height: 3000, when I am give here Height then the Screen scrolled.
                  width: Get.width,
                  child: Stack(
                    clipBehavior: Clip.none,
                    children: [
                      Card(
                        elevation: 10,
                        margin: EdgeInsets.all(0),
                        child: Container(
                          height: 120,
                          width: Get.width,
                          decoration: BoxDecoration(
                            gradient: LinearGradient(
                              colors: [
                                yellow,
                                green,
                              ],
                              begin: Alignment.topCenter,
                              end: Alignment.bottomCenter,
                            ),
                          ),
                          child: Padding(
                            padding: EdgeInsets.only(bottom: 20, left: 10),
                            child: Row(
                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
                              children: [
                                customBackButton(),
                                KText(
                                  text: 'Accept Order',
                                  fontSize: 35,
                                  fontFamily: brushScriptFonts,
                                  color: black,
                                ),
                                Container(),
                              ],
                            ),
                          ),
                        ),
                      ),
                      Positioned(
                        top: 100,
                        left: 20,
                        right: 20,
                        child: customContainerWidget(
                          // height: 400,
                          child: Padding(
                            padding: EdgeInsets.symmetric(
                              horizontal: 20,
                              vertical: 50,
                            ),
                            child: Column(
                              children: [
                                ListView.builder(
                                  shrinkWrap: true,
                                  primary: false,
                                  itemCount: productOrderC.productOrderList.length,
                                  itemBuilder: (context, index) {
                                    final item =
                                        productOrderC.productOrderList[index];
                                    return Padding(
                                      padding: EdgeInsets.only(bottom: 30),
                                      child: customBorderContainer(
                                        child: customOrderHistory(
                                          // onTap: () => Get.to(OrderCheckDetailsPage(
                                          //   allOrders: item,
                                          // )),
                                          onTap: () {},
    
                                          orderId: '${item.trackingId}',
                                          deliveryAddress: '23/A, Mirpur-10,Dhaka',
                                          orderTime: item.createdAt.toString(),
                                          status: item.ordertype!.name.toString(),
                                        ),
                                      ),
                                    );
                                  },
                                ),
                              ],
                            ),
                          ),
                        ),
                      ),
                    ],
                  ),
                ),
                SizedBox(height: 100),
              ],
            ),
          ),
        );
      }
    
      Widget customOrderHistory({
        required String? orderId,
        required String deliveryAddress,
        required String orderTime,
        required String status,
        required void Function()? onTap,
      }) {
        return Padding(
          padding: EdgeInsets.symmetric(
            horizontal: 20,
            vertical: 20,
          ),
          child: Column(
            children: [
              Row(
                children: [
                  KText(
                    text: 'Order ID : ',
                    color: black,
                    fontSize: 11,
                    fontWeight: FontWeight.bold,
                  ),
                  SizedBox(width: 10),
                  KText(
                    text: '$orderId',
                    fontSize: 20,
                    letterSpacing: 1.80,
                    fontWeight: FontWeight.bold,
                  ),
                ],
              ),
              sizeH20,
              Row(
                children: [
                  KText(
                    text: 'Delivery Address : ',
                    color: black,
                    fontSize: 11,
                    fontWeight: FontWeight.bold,
                  ),
                  SizedBox(width: 10),
                  KText(
                    text: deliveryAddress,
                    fontSize: 12,
                    fontWeight: FontWeight.bold,
                  ),
                ],
              ),
              sizeH20,
              Row(
                children: [
                  KText(
                    text: 'Time : ',
                    color: black,
                    fontSize: 11,
                    fontWeight: FontWeight.bold,
                  ),
                  SizedBox(width: 10),
                  KText(
                    text: orderTime,
                    fontSize: 12,
                    fontWeight: FontWeight.bold,
                  ),
                ],
              ),
              sizeH20,
              Row(
                children: [
                  KText(
                    text: 'Status : ',
                    color: black,
                    fontSize: 11,
                    fontWeight: FontWeight.bold,
                  ),
                  SizedBox(width: 10),
                  KText(
                    text: status,
                    fontSize: 12,
                    fontWeight: FontWeight.bold,
                  ),
                  Spacer(),
                  GestureDetector(
                    onTap: onTap,
                    child: KText(
                      text: 'Check Details',
                      fontSize: 20,
                      fontWeight: FontWeight.bold,
                    ),
                  ),
                ],
              ),
            ],
          ),
        );
      }
    }

Upvotes: 1

Views: 2878

Answers (2)

Luca Köster
Luca Köster

Reputation: 360

StackFit.expand and Positioned.fill I recommend using in an Expanded widget.

Scaffold(
  body: Column(
    children: [
      Expanded( // THIS
        child: Stack(
          fit: StackFit.expand, // THIS
          children: [
            Positioned.fill( // AND THIS
              child: WidgetXYZ(), 
            ),
          ],
        ),
      ),
    ],
  ),
)

Upvotes: 1

Koffi Innocent Konan
Koffi Innocent Konan

Reputation: 310

Try to use

Stack(
 fit: StackFit.expanded,
 …
);

Upvotes: 2

Related Questions