English 中文(简体)
如何在Stack Widget使用定位的植被?
原标题:How to use positioned Widget in Stack Widget?
  • 时间:2023-10-04 02:44:30
  •  标签:
  • flutter
  • dart

“entergraph

I want to get the screen like that(upper Image), But when I try to make it ,I just get this screen (below Image),I don t know how to get upper screen .Please help me. I think there is something wrong with my code.

这是我的法典。

import  package:flutter/material.dart ;

class SettingScreen extends StatefulWidget {
  const SettingScreen({super.key});[![enter image description here][2]][2]

  @override
  State<SettingScreen> createState() => _SettingScreenState();
}

class _SettingScreenState extends State<SettingScreen> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
          child: Column(
        children: [
          Container(
            width: double.infinity,
            height: 100,
            decoration: BoxDecoration(
                boxShadow: const [
                  BoxShadow(
                      color: Colors.black26,
                      blurRadius: 90,
                      offset: Offset(4, 9))
                ],
                gradient: LinearGradient(
                    colors: [
                      Color.fromARGB(255, 170, 148, 210),
                      Color.fromARGB(255, 65, 160, 195),
                      Color.fromARGB(255, 134, 174, 207),
                      Color.fromARGB(255, 155, 187, 212),
                    ],
                    begin: Alignment.topLeft,
                    end: Alignment.topRight,
                    stops: [0.2, 0.7, 0.9, 1.4])),
            child: Padding(
              padding: const EdgeInsets.all(18.0),
              child: Row(children: [
                Text(
                  "REL" +  
  + "  ATE",
                  style: TextStyle(
                    color: Colors.white,
                    fontWeight: FontWeight.bold,
                    fontSize: 10,
                    letterSpacing: 20,
                  ),
                ),
                SizedBox(
                  width: 130,
                ),
                Icon(
                  Icons.skip_next_rounded,
                  color: Colors.white,
                  size: 50,
                ),
              ]),
            ),
          ),
          Stack(
            children: [
              Container(
                width: 300,
                height: 522,
                decoration:
                    BoxDecoration(color: Colors.white, boxShadow: const [
                  BoxShadow(
                    color: Colors.black,
                    offset: Offset(1, 2),
                    blurRadius: 50,
                  )
                ]),
              ),
              Positioned(
                top: 10,
                right: 3,
                child: SizedBox(
                  child: Container(
                    // width: 500,
                    child: Column(
                      children: [
                        Text(
                          "SETTINGS",
                          style: TextStyle(
                              color: Colors.black,
                              fontWeight: FontWeight.bold,
                              fontSize: 30,
                              letterSpacing: 20),
                        ),
                        Padding(
                          padding: EdgeInsets.only(right: 100, top: 10),
                          child: Text(
                            "ACCOUNT",
                            style: TextStyle(color: Colors.grey),
                          ),
                        ),
                        Divider(
                          color: Colors.grey,
                          thickness: 100,
                          height: 20,
                        )
                      ],
                    ),
                  ),
                ),
              )
            ],
          )
        ],
      )),
    );
  }
}

但是,我接受了第二次筛查,“S”在环境中失踪。 请帮助我。

“entergraph

最佳回答

You can use Stack s clipBehavior, set it to

clipBehavior: Clip.none,

Hope it helps you!

问题回答

暂无回答




相关问题
Flutter App cannot be installed on Android TV

I m building a Flutter app that should support Android TV and Mobile devices. Despite Google Play shows that it is supported, I cannot install app on my MiBox device. While trying to install it, both ...

Moving the icon button to the right causes rendering issues

I am trying to align the icon button to the right of the Text field, I tried the row which made the icon button not centered vertically and now I am trying out the Stack widget. Here is my code - ...

热门标签