我正在为我的应用制作一个ImagePicker小部件。我使用setState方法来更新_displayPictureLoadState
和_displayPictureSource
参数以响应图像选择器事件。 dev.log('$loadState ${loadState == DisplayPictureState.loadSuccess}');
每次都返回更新的值。但是,没有任何内联条件能够正确呈现。例如,开发人员登录了DisplayPictureState.loadSuccess true
,但是内联三元运算符loadState == DisplayPictureState.loadSuccess ? Widget1 : Widget2
返回了Widget2?我很困惑。我希望在此问题上有所帮助。
App.dart
CSSDisplayPictureSelector(
width: width,
onTap: _skinCreatorService.setDisplayPicture,
source: _displayPictureSource,
loadState: _displayPictureLoadState),
CSSDisplayPictureSelector.dart
import 'dart:developer' as dev;
import 'package:flutter/material.dart';
import 'package:flutter_vector_icons/flutter_vector_icons.dart';
import 'package:[redacted]/Core/Services/Services.dart';
import 'package:[redacted]/Widgets/RoundedImage.dart';
import 'package:touchable_opacity/touchable_opacity.dart';
class CSSDisplayPictureSelector extends StatelessWidget {
final double width;
final Function onTap;
final DisplayPictureState loadState;
final source;
const CSSDisplayPictureSelector(
{Key key, this.width, this.onTap, this.loadState, this.source})
: super(key: key);
@override
Widget build(BuildContext context) {
dev.log('$loadState ${loadState == DisplayPictureState.loadSuccess}');
return TouchableOpacity(
onTap: onTap,
child: Container(
width: width,
padding: EdgeInsets.only(left: 60, right: 60, top: 30),
child: Center(
child: Stack(
children: <Widget>[
loadState == DisplayPictureState.loadSuccess
? RoundedImage(
byteSource: source,
size: width / 2,
key: UniqueKey(),
)
: RoundedImage(
imgSource: source,
size: width / 2,
key: UniqueKey(),
),
Container(
width: width / 2,
height: width / 2,
decoration: BoxDecoration(
color: Color(0x88000011),
borderRadius: BorderRadius.circular(width),
),
child: Center(
child: loadState == DisplayPictureState.loading
? CircularProgressIndicator(
valueColor:
new AlwaysStoppedAnimation<Color>(Colors.white))
: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Icon(Ionicons.md_camera,
size: 40, color: Colors.white),
Text(
loadState == DisplayPictureState.loadSuccess
? "Uploaded"
: "Upload",
style: TextStyle(
color: Colors.white,
fontSize: 20,
),
),
],
),
),
),
],
),
),
),
);
;
}
}
RoundedImage.dart
import 'dart:developer' as dev;
import 'dart:io';
import 'package:flutter/material.dart';
class RoundedImage extends StatelessWidget {
final String imgSource;
final byteSource;
final double size;
final BorderSide border;
bool borderInset;
final Key key;
var ImageBuilder;
RoundedImage(
{Key this.key,
this.imgSource,
this.byteSource,
@required this.size,
this.border,
this.borderInset = true})
: assert((imgSource == null && byteSource != null) ||
(imgSource != null && byteSource == null)),
super(key: key);
@override
Widget build(BuildContext context) {
var makeRoundedImage;
if (this.imgSource == null && this.byteSource != null) {
dev.log('RoundedImageDebugLog',
name: 'build:RoundedImage', error: {'data': 'hello $byteSource'});
dev.debugger();
makeRoundedImage = (diameter) => ClipRRect(
borderRadius: BorderRadius.circular(diameter / 2),
child: Image.memory(
byteSource,
width: diameter,
height: diameter,
),
);
} else {
makeRoundedImage = (diameter) => ClipRRect(
borderRadius: BorderRadius.circular(diameter / 2),
child: Image.asset(
this.imgSource,
width: diameter,
height: diameter,
),
);
}
if (this.border == null) {
return makeRoundedImage(this.size);
} else {
double innerSize =
this.borderInset ? this.size - this.border.width : this.size;
double outerSize =
this.borderInset ? this.size : this.size + this.border.width;
return Stack(
alignment: AlignmentDirectional.center,
children: <Widget>[
Container(
width: outerSize,
height: outerSize,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(outerSize / 2),
color: this.border.color,
),
),
makeRoundedImage(innerSize),
],
);
}
}
}