如何使circleAvatar超过一个的背景图像

Question 1

这里是我的代码.. 在这里，我想CircleAvatar在这一背景图像。

     body: SingleChildScrollView(
      child: Stack(
      children: [
        Column(
          children: [
            CircleAvatar(
              backgroundImage: AssetImage('images/images.jpg'),
            ),
            Image(
              image: AssetImage('images/flutter.jpg'),
            ),
            label('First Name'),
            label('Second name'),
            label('Email-id'),
            label('Passowrd'),
            label('Confirm passowrd'),
               ],
               ),
             ],
            ),
          ),
        backgroundColor: Colors.white,
      );
   }
 }

还有一件事如何得到梯度应用栏. 在此先感谢。!

Question 2

尝试

Container(
    decoration: BoxDecoration(
        image: DecorationImage(
            image: AssetImage('images/flutter.jpg'),
            fit: BoxFit.cover,
            ),
        ),
        child: Padding(
             padding: const EdgeInsets.all(8.0),
             child: CircleAvatar(
                backgroundImage: AssetImage('images/images.jpg'),
                ),
            ),
),

而不是的

CircleAvatar(
    backgroundImage: AssetImage('images/images.jpg'),
),
Image(
    image: AssetImage('images/flutter.jpg'),
    ),

和gredient应用程序吧你可以使用 https://pub.dev/packages/new_gradient_app_bar

Question 3

应用栏件没有梯度的选择，但是你可以添加这样的：

appBar: AppBar(
  centerTitle: true,
    title: Text('title'),
    flexibleSpace: Container(
      decoration: BoxDecoration(
        gradient: LinearGradient(
          begin: Alignment.topLeft,
            end: Alignment.bottomRight,
            colors: <Color>[
          Colors.red,
          Colors.blue
        ])          
     ),        
 ),      
)

Question 4

你没有使用堆为你需要的。你需要建立堆下列与使用 position

SingleChildScrollView(
        child: Column(
          children: [
            Stack(
              children: [
                SizedBox(
                  height: 200,
                  width: double.infinity,
                  child: Image(
                    image: AssetImage('images/profile.png'),
                  ),
                ),
                Positioned(
                  bottom: 0,
                  left: MediaQuery.of(context).size.width / 2 - 20,
                  child: CircleAvatar(
                    backgroundImage: AssetImage('images/profile.png'),
                  ),
                ),
              ],
            ),
            Text('First Name'),
            Text('Second name'),
            Text('Email-id'),
            Text('Passowrd'),
            Text('Confirm passowrd')
          ],
        ),
      )

Hüseyin Gözübenli · Answer 1 · 2021-11-24T06:22:36

尝试

Container(
    decoration: BoxDecoration(
        image: DecorationImage(
            image: AssetImage('images/flutter.jpg'),
            fit: BoxFit.cover,
            ),
        ),
        child: Padding(
             padding: const EdgeInsets.all(8.0),
             child: CircleAvatar(
                backgroundImage: AssetImage('images/images.jpg'),
                ),
            ),
),

而不是的

CircleAvatar(
    backgroundImage: AssetImage('images/images.jpg'),
),
Image(
    image: AssetImage('images/flutter.jpg'),
    ),

和gredient应用程序吧你可以使用 https://pub.dev/packages/new_gradient_app_bar

Rohith Nambiar · Answer 2 · 2021-11-24T06:13:39

应用栏件没有梯度的选择，但是你可以添加这样的：

appBar: AppBar(
  centerTitle: true,
    title: Text('title'),
    flexibleSpace: Container(
      decoration: BoxDecoration(
        gradient: LinearGradient(
          begin: Alignment.topLeft,
            end: Alignment.bottomRight,
            colors: <Color>[
          Colors.red,
          Colors.blue
        ])          
     ),        
 ),      
)

Jahidul Islam · Answer 3 · 2021-11-24T06:34:21

你没有使用堆为你需要的。你需要建立堆下列与使用 position

SingleChildScrollView(
        child: Column(
          children: [
            Stack(
              children: [
                SizedBox(
                  height: 200,
                  width: double.infinity,
                  child: Image(
                    image: AssetImage('images/profile.png'),
                  ),
                ),
                Positioned(
                  bottom: 0,
                  left: MediaQuery.of(context).size.width / 2 - 20,
                  child: CircleAvatar(
                    backgroundImage: AssetImage('images/profile.png'),
                  ),
                ),
              ],
            ),
            Text('First Name'),
            Text('Second name'),
            Text('Email-id'),
            Text('Passowrd'),
            Text('Confirm passowrd')
          ],
        ),
      )

如何使circleAvatar超过一个的背景图像

的问题

最好的答案

其他语言

此页面有其他语言版本

受欢迎的此类别

流行的问题，在这个类别