List<Map> imageList = [
{
'provider': const NetworkImage(
"https://img.zcool.cn/community/012c1559b2441ea801211d258355d3.jpg@1280w_1l_2o_100sh.jpg"),
'tag': 'tag1',
'fillScale': PhotoViewComputedScale.covered
},
{
'provider': const NetworkImage(
"http://img.pptjia.com/image/20180117/767f4b74a8d7b453b149430ee364c9ce.jpg"),
'tag': 'tag2',
'fillScale': PhotoViewComputedScale.contained
},
{
'provider': const NetworkImage(
"http://www.hiphotos.baidu.com/image/pic/item/8644ebf81a4c510f3666841a6b59252dd42aa514.jpg"),
'tag': 'tag3',
'fillScale': PhotoViewComputedScale.contained
},
{
'provider':
const NetworkImage("http://www.17qq.com/img_qqtouxiang/30526384.jpeg"),
'tag': 'tag4',
'fillScale': PhotoViewComputedScale.contained
}
];
List<PhotoViewGalleryPageOptions> _takePageOptions(
List<Map> imageProviderList) {
return imageProviderList.map(
(map) {
return PhotoViewGalleryPageOptions(
imageProvider: map['provider'],
minScale: map['fillScale'],
maxScale: PhotoViewComputedScale.covered * 1.1,
initialScale: map['fillScale'],
heroTag: map['tag'],
);
},
).toList();
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: Container(
constraints: BoxConstraints.expand(
height: MediaQuery.of(context).size.height,
),
child: Stack(
alignment: Alignment.bottomRight,
children: <Widget>[
PhotoViewGallery(
pageOptions: _takePageOptions(widget.imageList),
// pageOptions: <PhotoViewGalleryPageOptions>[
// PhotoViewGalleryPageOptions(
// imageProvider: widget.imageProvider,
// heroTag: "tag1",
// ),
// PhotoViewGalleryPageOptions(
// imageProvider: widget.imageProvider2,
// heroTag: "tag2",
// maxScale: PhotoViewComputedScale.contained * 0.3),
// PhotoViewGalleryPageOptions(
// imageProvider: widget.imageProvider3,
// minScale: PhotoViewComputedScale.contained * 0.8,
// maxScale: PhotoViewComputedScale.covered * 1.1,
// heroTag: "tag3",
// ),
// ],
loadingChild: widget.loadingChild,
backgroundDecoration: widget.backgroundDecoration,
pageController: widget.pageController,
onPageChanged: onPageChanged,
),
Container(
padding: const EdgeInsets.all(20.0),
child: Text(
"Image ${currentIndex + 1}",
style: const TextStyle(
color: Colors.white, fontSize: 17.0, decoration: null),
),
)
],
)),
);
}
And I set zhe code in photo_view_image_wrapper is invalid
Widget _buildChild() {
return widget.customChild == null
? Image(
image: widget.imageProvider,
gaplessPlayback: widget.gaplessPlayback,
fit: BoxFit.contain,
alignment: Alignment.topCenter,
)
: widget.customChild;
}
I can't quite understand your issue. What is this about? A bug, a request?
Could you explain better your problem?
ok,this is a request. when I set zhe [PhotoViewGallery pageOptions initialScale]`s value is PhotoViewComputedScale.covered, and set image like (https://img.zcool.cn/community/012c1559b2441ea801211d258355d3.jpg@1280w_1l_2o_100sh.jpg) [a very long vertical image],zhe Photo_View show me zhe image center, I want show zhe top at zhe initial state , what should I do?
Currently, Photoview has no support to set the image automatically to a position different from the center. Ideally, this should be available in future releases where we could customize photo view behavior through a controller pattern (just like TextEditorController).
To achieve the desired behavior, I would recommend you to put the image in a CustomScrollView.
There is still a request. When PageView slides to the margin in the zooming state, you can continue to slide to the next image. What should I do?
Having a controller to manage the image position somewhere other than the center would be a great feature.
We have added the option basePosition in #89 .
Cool! Is there any ETA for the release of #89 ?
As soon as I get back home and finish tests. Could you help me with unity tests, @iNima?
Do you mean "unit" tests?
Yes, I'd like to help. I have not found any unit test in the repo.
Do you like me to write some unit tests for the project?
Wow...How to use the controller,now? @renancaraujo @iNima I set the basePostion centerTop. The long vertical image cann't scroll to the image bottom?
I edit the postion in the onScaleUpadate to solve the problem。。Like this
// _position = clampPosition(delta * details.scale);
final Alignment basePosition = Alignment.topCenter;
Offset postion = clampPosition(delta * details.scale);
double dx = postion.dx;
double dy = postion.dy;
if (basePosition.y < 0) {
dy = postion.dy > 0 ? 0 : postion.dy;
if (basePosition.x < 0) {
dx = postion.dx > 0 ? 0 : postion.dx;
}
} else if (basePosition.y > 0) {
dy = postion.dy < 0 ? 0 : postion.dy;
if (basePosition.x > 0) {
dx = postion.dx < 0 ? 0 : postion.dx;
}
}
_position = Offset(dx, dy);
And add these code in the singlechildLayoutDelegate
@override
Offset getPositionForChild(Size size, Size childSize) {
final double offsetX =
((size.width - childSize.width) / 2) * (basePosition.x + 1);
final double offsetY =
((size.height - childSize.height) / 2) * (basePosition.y + 1);
double offsetDy = basePosition.y < 0
? (postion.dy < 0 ? postion.dy / scale : -postion.dy / scale)
: (postion.dy > 0 ? -postion.dy / scale : postion.dy / scale);
double offsetDx = basePosition.x < 0
? (postion.dx < 0 ? postion.dx / scale : -postion.dx / scale)
: (postion.dx > 0 ? -postion.dx / scale : postion.dx / scale);
print(
'dy:$postion.dy*************offsetDy:$offsetDy*************offsetY:$offsetY*************');
return Offset(offsetX + offsetDx, offsetY + offsetDy);
}
Ive managed to write unity tests for the controller. Now it is on master.
To use it now, put photo_view as a git dependency pointing to this repo.
Edit: Released on 0.2.0
Most helpful comment
We have added the option
basePositionin #89 .