ZLPhotoBrowser icon indicating copy to clipboard operation
ZLPhotoBrowser copied to clipboard

iPad 分屏浏览时UI显示有问题

Open Janlor opened this issue 2 years ago • 3 comments

问题1: columnCount 属性没有考虑分屏浏览的情况。

目前的适配策略是这样的: columnCount 表示竖屏 iPhone 的一行显示个数,最小2、最大6,默认4。 横屏 iPhone 时 columnCount += 2,竖屏 iPad 时 columnCount += 2,横屏 iPad 时 columnCount += 4。

这个策略在 App 只支持全屏展示时表现正常,但是在 iPad 分屏浏览时会有问题。 比如当前 App 和另一个 App 以 Split View 1:3 并排显示在横屏的屏幕上时,当前 App 一行显示 8 张图片,显得特别挤,而且当窗口大小改变时,App 布局没有跟着动态改变。

建议修改 columnCount 适配策略,我目前的适配方案是: columnCount 还是表示竖屏 iPhone 的一行显示个数,这个不用改。 然后不用考虑当前是 iPhone 还是 iPad、横屏还是竖屏,显示的 columnCount 根据以下方式动态计算: 修改 ZLThumbnailViewController 的 collectionView(_:layout:siizeForItemAt:) 里的代码:

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
    let defaultCount = CGFloat(ZLPhotoConfiguration.default().columnCount)
    let columnCount = Int(ceil(Float(collectionView.bounds.width / (428.0 / defaultCount))))
    let totalWidth = collectionView.bounds.width - CGFloat((columnCount - 1)) * ZLLayout.thumbCollectionViewItemSpacing
    let itemWidth = CGFloat(floorf(Float(totalWidth) / Float(columnCount)))
    return CGSize(width: itemWidth, height: itemWidth)
}

在窗口尺寸改变时使布局失效,重新布局:

override func viewWillTransition(to size: CGSize, with coordinator: UIViewControllerTransitionCoordinator) {
    super.viewWillTransition(to: size, with: coordinator)
    collectionView.collectionViewLayout.invalidateLayout()
}

这里的 428.0 是最宽的 iPhone 13 Pro Max 的宽度,这个计算方法在竖屏的 iPhone 上还是显示默认值,也符合苹果大屏幕显示更多内容的设计理念,在 macOS 或 tvOS 等其它平台上也表现正常。 这个适配方案是根据我司 App 特色自创的(因为产品不允许竖屏 iPhone 上的显示效果发生变化)。 这么写可能在特别大的屏幕比如 12.9寸 iPad 和 Mac 上显示内容过多,可以判断 collectionView 的宽度大于某个值时更改 defaultCount 的值,比如 collectionView.bounds.width > 800 时 defaultCount += 2,这都是显示策略调整,没有标准答案,期待作者在新版本中修改下这部分代码,期待更好的适配方案,感谢~。

问题2:裁剪照片页面没有适配分屏浏览

以下代码打开相册选择了一张照片,并立即进入裁剪页面。这个裁剪页面图片展示部分没有适配 iPad 分屏浏览。

let editImageConfig = ZLPhotoConfiguration.default().editImageConfiguration
editImageConfig
    .tools([.clip])
    .clipRatios([.wh1x1])

ZLPhotoConfiguration.default()
    .maxSelectCount(1)
    .editImageConfiguration(editImageConfig)
    .editAfterSelectThumbnailImage(true)
    .showClipDirectlyIfOnlyHasClipTool(true)
    .allowTakePhotoInLibrary(false)

let photoPicker = ZLPhotoPreviewSheet(selectedAssets: nil)
photoPicker.selectImageBlock = { images, assets, isFull in
    if let image = images.first { finished(image) }
}
photoPicker.showPhotoLibrary(sender: sender)

Janlor avatar Jun 06 '22 10:06 Janlor

框架没有太多的适配iPad,编辑界面在iPad上横竖屏旋转也会有一些问题。 分屏的话现在完全没适配。。

longitachi avatar Jun 07 '22 12:06 longitachi

框架没有太多的适配iPad,编辑界面在iPad上横竖屏旋转也会有一些问题。

分屏的话现在完全没适配。。

感谢回复~ 目前我们iPad App还在适配中,没有上线。最近我正在将App中选择和浏览照片的部分都换成这个框架,分屏浏览还得适配。

你没有时间支持的话我可以在后续抽空提交pull request,你看看没问题的话希望可以merge一下,或者我fork一份自己用~

Janlor avatar Jun 08 '22 07:06 Janlor

可以先fork下,测试OK的话可以提个pr

longitachi avatar Jun 08 '22 08:06 longitachi

所以适配了吗,我现在也需要这个呢

jaylanlu avatar Dec 05 '22 02:12 jaylanlu

@Janlor @jaylanlu 准备添加一个block,block外面实现,返回一个columnCount,框架就不做控制了,由使用者去控制

longitachi avatar Dec 15 '22 03:12 longitachi

https://github.com/longitachi/ZLPhotoBrowser/commit/7dfac5b27469d12b8a59d49b3c3e3c636f4f7314 fixed

longitachi avatar Dec 19 '22 07:12 longitachi