VoiceOver 滑动时如何水平滚动 UIStackView？答案

【问题标题】：How to scroll UIStackView horizontally when VoiceOver swipe?VoiceOver 滑动时如何水平滚动 UIStackView？
【发布时间】：2020-05-07 04:43:30
【问题描述】：

我有一个水平的 UIStackView，里面有几个按钮。按钮的数量不是固定的，stack view 的长度可能会超过屏幕宽度。

我使用结构 UIScrollView - UIView - UIStackView 在长度小于屏幕宽度时右对齐，当长度超过时左对齐。

右对齐：左对齐：

当 VoiceOver 开启时，它只会读取屏幕上的按钮。

我尝试将所有按钮添加到accessibilityElements。 VoiceOver 可以读取所有按钮，但不会滚动堆栈视图以显示它们。当从堆栈视图下方的元素滑动时，VoiceOver 仍然会忽略不在屏幕中的按钮。所以添加到accessibilityElements 不能解决这个问题。

有人知道当用户滑动屏幕时如何滚动堆栈视图以显示隐藏按钮吗？提前致谢。

【问题讨论】：

@XLE_22 我尝试与您编辑的答案相同，但它显示错误：滚动视图 - 需要约束：X（Y）位置或宽度（高度）。
很奇怪，因为我的屏幕截图是我在 Xcode 11 下编码的确切结果，并且可以正常工作。当我有更多时间时，我会看看，但看看我展示的约束，以确保你有完全相同的。 ??????
@XLE_22 请检查以下屏幕截图，重点关注“我的滚动视图”，有错误图标。

标签： ios uistackview voiceover

【解决方案1】：

有人知道如何在用户滑动屏幕时滚动堆栈视图以显示隐藏按钮吗？

将堆栈视图嵌入到滚动视图中，以便能够获取屏幕外的元素：您可以在Interface Builder 或programmatically 中执行此操作。

这是我在 Xcode 下的配置，用于在 UIStackView 内使用 VoiceOver 滑动按钮：我终于在我的设备上得到了以下结果：我没有在UIStackView 中使用对齐方式，但根据这个原理，您可以滚动堆栈视图以在用户滑动屏幕时显示隐藏按钮。

⚠️ ⬛️◼️?▪️ 编辑 ▪️?◼️⬛️ ⚠️ （2020 年 2 月：在原始问题中添加新约束后）

对齐是我的主要需求。

正如我在评论中所解释的，布局约束是在不使用专用 UIView 的情况下实现目标的解决方案。

我在下面详细介绍了 Interface Builder 的配置：只需几行代码如下：

@IBOutlet weak var myScrollView: UIScrollView!
@IBOutlet weak var myStackView: UIStackView!

override func viewDidAppear(_ animated: Bool) {
    super.viewDidAppear(animated)

    let delta = myScrollView.frame.width - myStackView.frame.width
    let constant = (delta > 0.0) ? delta : 0.0

    myStackView.leadingAnchor.constraint(greaterThanOrEqualTo: myScrollView.contentLayoutGuide.leadingAnchor,
                                         constant: constant).isActive = true
}

...您可以通过 5 个按钮获得此结果： ...并且通过几个按钮保持正确的对齐方式：

现在，您可以在 VoiceOver 滑动时水平滚动 UIStackView。 ?

【讨论】：

这不适用于我的情况。当 UIScrollView 和 UIStackView 之间有 UIView 时，它不会自动滚动。
在滚动视图中直接嵌入堆栈视图不能在其长度小于屏幕宽度时使其右对齐，而当它较长时则左对齐。对齐是我的主要需求，所以我必须在两者之间放置一个 UIView 才能做到这一点。

【解决方案2】：

解决方案是继承 UIButton 并覆盖它的 accessibilityElementDidBecomeFocused 方法。

MyButton.h

@interface MyButton : UIButton

@property (weak, nonatomic) UIScrollView *scrollView;

@end

MyButton.m

#import "MyButton.h"

@implementation MyButton

- (void)accessibilityElementDidBecomeFocused
{
    [self.scrollView scrollRectToVisible:CGRectMake(self.frame.origin.x, self.frame.origin.y, self.bounds.size.width, self.bounds.size.height) animated:YES];
}

@end

【讨论】：