加载时颤振圆形头像背景颜色
Flutter Circular Avatar background color while loading
我使用了两个圆形头像(第一个是白色背景,只是稍微大一点,以创建一个白色边框)。
第二个也将背景 属性 设置为白色。
但是在加载图像之前,我看到了蓝色背景。正如您从代码中看到的那样,背面没有任何蓝色小部件......
我希望在小部件加载图片时有黑色或白色背景。
return Scaffold(
backgroundColor: Colors.white,
body: Container(
padding: const EdgeInsets.only(top: 30),
width: MediaQuery.of(context).size.width,
height: MediaQuery.of(context).size.height,
color: appColor,
child: SingleChildScrollView(
scrollDirection: Axis.vertical,
child: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const SizedBox(
width: 0,
height: 20,
),
const Center(
child: Text(
'WhyBye ',
style: TextStyle(
color: Colors.white,
fontFamily: 'Savor',
fontSize: 40,
),
),
),
const SizedBox(
width: 0,
height: 10,
),
Stack(
//& Stack contenente l'immagine del profilo.
children: [
_image != null
? CircleAvatar(
radius: 100,
backgroundColor: Colors.white,
child: CircleAvatar(
radius: 96,
backgroundImage: MemoryImage(_image!),
))
: CircleAvatar(
radius: 100,
backgroundColor: Colors.white,
child: CircleAvatar(
radius: 96,
backgroundImage: Variables.userPicUrl.isNotEmpty
? NetworkImage(Variables.userPicUrl)
: null,
)),
Positioned(
//& All'interno del precedente Stack, posizionamento dei pulsanti immagine dalla galleria/fotocamera.
bottom: -10,
left: 15,
child: IconButton(
onPressed: () {
selectImage(ImageSource.gallery);
},
icon: const Icon(Icons.photo_library_rounded),
color: Colors.white,
iconSize: 32,
),
),
Positioned(
bottom: -10,
left: 135,
child: IconButton(
onPressed: () {
selectImage(ImageSource.camera);
},
icon: const Icon(Icons.add_a_photo),
color: Colors.white,
iconSize: 32,
),
),
按照 CircleAvatar 的文档:
If a backgroundColor is not specified, the theme's ThemeData.primaryColorLight is used with dark foreground colors, and ThemeData.primaryColorDark with light foreground colors.
我认为您使用的是默认主题(使用蓝色作为原色)。尝试明确定义内圈的透明颜色,这样在加载时你只能看到外圈的颜色
我认为你需要添加
Blockquote
foregroundImage
图片提供者?
圆的前景图像。 [...]
您可以决定使用深色图像
我使用了两个圆形头像(第一个是白色背景,只是稍微大一点,以创建一个白色边框)。 第二个也将背景 属性 设置为白色。 但是在加载图像之前,我看到了蓝色背景。正如您从代码中看到的那样,背面没有任何蓝色小部件...... 我希望在小部件加载图片时有黑色或白色背景。
return Scaffold(
backgroundColor: Colors.white,
body: Container(
padding: const EdgeInsets.only(top: 30),
width: MediaQuery.of(context).size.width,
height: MediaQuery.of(context).size.height,
color: appColor,
child: SingleChildScrollView(
scrollDirection: Axis.vertical,
child: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const SizedBox(
width: 0,
height: 20,
),
const Center(
child: Text(
'WhyBye ',
style: TextStyle(
color: Colors.white,
fontFamily: 'Savor',
fontSize: 40,
),
),
),
const SizedBox(
width: 0,
height: 10,
),
Stack(
//& Stack contenente l'immagine del profilo.
children: [
_image != null
? CircleAvatar(
radius: 100,
backgroundColor: Colors.white,
child: CircleAvatar(
radius: 96,
backgroundImage: MemoryImage(_image!),
))
: CircleAvatar(
radius: 100,
backgroundColor: Colors.white,
child: CircleAvatar(
radius: 96,
backgroundImage: Variables.userPicUrl.isNotEmpty
? NetworkImage(Variables.userPicUrl)
: null,
)),
Positioned(
//& All'interno del precedente Stack, posizionamento dei pulsanti immagine dalla galleria/fotocamera.
bottom: -10,
left: 15,
child: IconButton(
onPressed: () {
selectImage(ImageSource.gallery);
},
icon: const Icon(Icons.photo_library_rounded),
color: Colors.white,
iconSize: 32,
),
),
Positioned(
bottom: -10,
left: 135,
child: IconButton(
onPressed: () {
selectImage(ImageSource.camera);
},
icon: const Icon(Icons.add_a_photo),
color: Colors.white,
iconSize: 32,
),
),
按照 CircleAvatar 的文档:
If a backgroundColor is not specified, the theme's ThemeData.primaryColorLight is used with dark foreground colors, and ThemeData.primaryColorDark with light foreground colors.
我认为您使用的是默认主题(使用蓝色作为原色)。尝试明确定义内圈的透明颜色,这样在加载时你只能看到外圈的颜色
我认为你需要添加
Blockquote
foregroundImage 图片提供者? 圆的前景图像。 [...]
您可以决定使用深色图像