Skip to content

Commit

Permalink
Fix: Thumb
Browse files Browse the repository at this point in the history
  • Loading branch information
@honjow
honjow committed Jul 29, 2021
1 parent e759a3b commit 9ee4b0f
Show file tree
Hide file tree
Showing 6 changed files with 152 additions and 44 deletions.
4 changes: 2 additions & 2 deletions lib/common/service/depth_service.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,13 +15,13 @@ class DepthService extends GetxService {
// 路由入栈时 深度+1
void pushPageCtrl() {
pageCtrlDepth++;
logger.d('pushPageCtrl to $pageCtrlDepth');
logger.v('pushPageCtrl to $pageCtrlDepth');
}

// 出栈 深度-1 放在onClose事件中
void popPageCtrl() {
pageCtrlDepth--;
logger.d('popPageCtrl to $pageCtrlDepth');
logger.v('popPageCtrl to $pageCtrlDepth');
}

/// [searchPageCtrlDepth] 搜索页深度
Expand Down
74 changes: 60 additions & 14 deletions lib/pages/image_view_ext/controller/view_ext_contorller.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -62,6 +62,10 @@ class ViewExtController extends GetxController {
final ItemPositionsListener itemPositionsListener =
ItemPositionsListener.create();

final ItemScrollController thumbScrollController = ItemScrollController();
final ItemPositionsListener thumbPositionsListener =
ItemPositionsListener.create();

final AutoScrollController autoScrollController = AutoScrollController();
final photoViewScaleStateController = PhotoViewScaleStateController();

Expand All @@ -87,6 +91,14 @@ class ViewExtController extends GetxController {
handItemPositionsChange(positions);
});

Future.delayed(const Duration(milliseconds: 100)).then((value) =>
thumbScrollController.jumpTo(index: vState.currentItemIndex));

thumbPositionsListener.itemPositions.addListener(() {
final positions = thumbPositionsListener.itemPositions.value;
handThumbPositionsChange(positions);
});

/// 初始预载
/// 后续的预载触发放在翻页事件中
if (vState.loadType == LoadType.network) {
Expand Down Expand Up @@ -260,22 +272,21 @@ class ViewExtController extends GetxController {

// 直接获取需要的
await _galleryPageController.loadImagesForSer(itemSer);

// logger.v('获取缩略结束后 预载图片');
GalleryPara.instance
.precacheImages(
Get.context!,
imageMap: _galleryPageController.imageMap,
itemSer: itemSer,
max: _ehConfigService.preloadImage.value,
)
.listen((GalleryImage? event) {
if (event != null) {
_galleryPageController.uptImageBySer(ser: event.ser, image: event);
}
});
}

GalleryPara.instance
.precacheImages(
Get.context!,
imageMap: _galleryPageController.imageMap,
itemSer: itemSer,
max: _ehConfigService.preloadImage.value,
)
.listen((GalleryImage? event) {
if (event != null) {
_galleryPageController.uptImageBySer(ser: event.ser, image: event);
}
});

final GalleryImage? image = await _galleryPageController.getImageInfo(
itemSer,
cancelToken: vState.getMoreCancelToken,
Expand Down Expand Up @@ -394,7 +405,12 @@ class ViewExtController extends GetxController {
}

void handOnSliderChangedEnd(double value) {
final curIndex = vState.currentItemIndex;
jumpToPage(value.round());
if ((value.round() - curIndex).abs() > 20) {
Future.delayed(const Duration(milliseconds: 200))
.then((value) => reIndexThumb());
}
}

void jumpToPage(int index) {
Expand Down Expand Up @@ -625,6 +641,36 @@ class ViewExtController extends GetxController {
// logger.i('First Item: ${min ?? ''}\nLast Item: ${max ?? ''}');
}

void handThumbPositionsChange(Iterable<ItemPosition> positions) {
int? min;
int? max;
if (positions.isNotEmpty) {
min = positions
.where((ItemPosition position) => position.itemTrailingEdge > 0)
.reduce((ItemPosition min, ItemPosition position) =>
position.itemTrailingEdge < min.itemTrailingEdge ? position : min)
.index;
max = positions
.where((ItemPosition position) => position.itemLeadingEdge < 1)
.reduce((ItemPosition max, ItemPosition position) =>
position.itemLeadingEdge > max.itemLeadingEdge ? position : max)
.index;

final midIndex = (min + max) ~/ 2;
if (vState.mindThumbIndex != midIndex) {
vState.mindThumbIndex = midIndex;
}
}
}

void reIndexThumb() {
thumbScrollController.scrollTo(
index: vState.currentItemIndex,
duration: const Duration(milliseconds: 300),
curve: Curves.ease,
);
}

Future<void> _toPage({int? index}) async {
if (vState.pageIndex >= vState.pageCount - 1) {
return;
Expand Down
3 changes: 2 additions & 1 deletion lib/pages/image_view_ext/controller/view_ext_state.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -141,7 +141,7 @@ class ViewExtState {
bool showBar = false;

/// 底栏高度
double bottomBarHeight = 0.0;
double bottomBarHeight = -1;

/// 底栏偏移
double get bottomBarOffset {
Expand Down Expand Up @@ -181,4 +181,5 @@ class ViewExtState {
int tempIndex = 0;

bool showThumbList = false;
int mindThumbIndex = 0;
}
109 changes: 83 additions & 26 deletions lib/pages/image_view_ext/view/view_ext.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ import 'package:fehviewer/pages/gallery/controller/gallery_page_controller.dart'
import 'package:fehviewer/route/routes.dart';
import 'package:fehviewer/utils/logger.dart';
import 'package:fehviewer/utils/toast.dart';
import 'package:fehviewer/utils/vibrate.dart';
import 'package:fehviewer/widget/eh_cached_network_image.dart';
import 'package:fehviewer/widget/network_extended_image.dart';
import 'package:flutter/cupertino.dart';
Expand All @@ -19,6 +20,7 @@ import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:get/get.dart';
import 'package:line_icons/line_icons.dart';
import 'package:liquid_progress_indicator_ns/liquid_progress_indicator.dart';
import 'package:scrollable_positioned_list/scrollable_positioned_list.dart';
import 'package:sleek_circular_slider/sleek_circular_slider.dart';
import 'package:fehviewer/common/exts.dart';

Expand Down Expand Up @@ -550,6 +552,10 @@ class BottomBarControlWidget extends GetView<ViewExtController> {
onTap: () {
controller.switchShowThumbList();
},
onLongPress: () {
vibrateUtil.light();
controller.reIndexThumb();
},
child: Container(
width: 40,
height: kBottomBarHeight,
Expand Down Expand Up @@ -641,10 +647,12 @@ class ThumbnailListView extends GetView<ViewExtController> {
return Container(
height: kThumbListViewHeight,
padding: const EdgeInsets.symmetric(vertical: 8, horizontal: 4),
// alignment: Alignment.center,
child: ListView.builder(
child: ScrollablePositionedList.builder(
itemScrollController: logic.thumbScrollController,
itemPositionsListener: logic.thumbPositionsListener,
itemCount: controller.vState.filecount,
scrollDirection: Axis.horizontal,
reverse: logic.vState.viewMode == ViewMode.rightToLeft,
itemBuilder: (context, index) {
late Widget thumb;
if (logic.vState.loadType == LoadType.file) {
Expand All @@ -655,30 +663,7 @@ class ThumbnailListView extends GetView<ViewExtController> {
fit: BoxFit.cover,
);
} else {
final itemSer = index + 1;
thumb = FutureBuilder<GalleryImage?>(
future: logic.fetchThumb(itemSer),
builder: (context, snapshot) {
if (snapshot.connectionState == ConnectionState.done) {
final _image = snapshot.data;
if (_image != null &&
_image.thumbUrl != null &&
_image.thumbUrl!.isNotEmpty) {
logger.v('${_image.ser} ${_image.thumbUrl}');

return EhCachedNetworkImage(
imageUrl: _image.thumbUrl ?? '',
progressIndicatorBuilder: (_, __, ___) {
return const CupertinoActivityIndicator();
},
);
} else {
return const SizedBox.shrink();
}
} else {
return const SizedBox.shrink();
}
});
thumb = FutureThumbl(itemSer: index + 1);
}

return GestureDetector(
Expand Down Expand Up @@ -721,6 +706,78 @@ class ThumbnailListView extends GetView<ViewExtController> {
}
}

class FutureThumbl extends StatefulWidget {
const FutureThumbl({
Key? key,
required this.itemSer,
}) : super(key: key);

final int itemSer;

@override
_FutureThumblState createState() => _FutureThumblState();
}

class _FutureThumblState extends State<FutureThumbl> {
final ViewExtController logic = Get.find();
late Future<GalleryImage?> _future;

@override
void initState() {
_future = logic.fetchThumb(widget.itemSer);
super.initState();
}

@override
Widget build(BuildContext context) {
return FutureBuilder<GalleryImage?>(
future: _future,
builder: (context, snapshot) {
if (snapshot.connectionState == ConnectionState.done) {
final _image = snapshot.data;
if (_image != null &&
_image.thumbUrl != null &&
_image.thumbUrl!.isNotEmpty) {
logger.v('${_image.ser} ${_image.thumbUrl}');

return EhCachedNetworkImage(
imageUrl: _image.thumbUrl ?? '',
placeholder: (_, __) {
return buildPlaceholder();
},
errorWidget: (ctx, url, error) {
return builderrorWidget();
},
);
} else {
return builderrorWidget();
}
} else {
return buildPlaceholder();
}
});
}

Container buildPlaceholder() {
return Container(
color: Colors.grey.withOpacity(0.3),
child: const Center(child: CupertinoActivityIndicator()),
);
}

GestureDetector builderrorWidget() {
return GestureDetector(
behavior: HitTestBehavior.opaque,
onTap: () {
_future = logic.fetchThumb(widget.itemSer);
setState(() {});
},
child: const Icon(LineIcons.alternateRedo,
color: CupertinoColors.destructiveRed),
);
}
}

/// 页面滑条
class ViewPageSlider extends StatefulWidget {
const ViewPageSlider({
Expand Down
4 changes: 4 additions & 0 deletions lib/pages/image_view_ext/view/view_ext_page.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -547,6 +547,10 @@ class ImagePlugins extends GetView<ViewExtController> {

@override
Widget build(BuildContext context) {
vState.bottomBarHeight = context.mediaQueryPadding.bottom +
kTopBarHeight * 2 +
(vState.showThumbList ? kThumbListViewHeight : 0);

return Container(
child: Stack(
alignment: Alignment.center,
Expand Down
2 changes: 1 addition & 1 deletion pubspec.yaml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ description: fehviewer

publish_to: 'none' # Remove this line if you wish to publish to pub.dev

version: 1.1.20+260
version: 1.1.20+261

environment:
sdk: '>=2.13.0 <3.0.0'
Expand Down

0 comments on commit 9ee4b0f

Please sign in to comment.