不再支持可切换的移动/桌面布局了吗？

贡献 用户体验
,
1

您好，我之前使用的是 stable 版本，现在升级到了最新的 esr 版本，似乎不再有可以明确切换的移动/桌面布局了？我再也看不到侧边栏左下角的切换按钮了，并且 ?mobile_view=1 / ?mobile_view=0 也不再起任何作用。现在它只是通过水平调整桌面浏览器窗口的大小，从带有侧边栏和左侧汉堡菜单的桌面模式过渡到没有侧边栏和右侧菜单的移动布局。那么现在它只是基于浏览器宽度了吗？以前它允许用户在更宽的平板电脑屏幕上使用简化的移动布局（如果需要），或者相反，允许用户在较小的手机或窄浏览器窗口中使用桌面模式（例如，在主题列表中显示更多详细信息），以满足那些更喜欢它的用户的需求。

1 个赞
2

那是正确的——我们一直在努力简化布局，使其能够完全响应式，因为使用基于宽度的断点是更广泛接受的设计标准。我们还发现维护起来更简单，而且基于宽度的布局也能很好地与其他外部设计元素配合，例如在主站点和论坛之间集成共享的横幅时。

5 个赞
3

这种方法的一个缺点是您无法在初始化程序中运行特定于设备的逻辑。

一个经典的例子是为移动设备和桌面设备设置不同的主页——您现在无法做到这一点。

依我看，这将需要一种更加动态的方法来创建模板。

1 个赞
4

感谢您的回复。原则上这说得通，但对于更高级/更频繁的用户来说，这在实践中有点问题。正如我所提到的，在精简布局模式下，主题列表中的信息可见性要少得多，特别是当使用类似 Sam's Simple Theme 这样的主题时，所以有些人更喜欢明确强制使用桌面布局，而且它甚至仍然能正确适应以适应宽度而不会溢出。

1 个赞
5

我们用新方法消除了这种做法的一些限制——在初始化时确定功能是相当不灵活的，如果有什么变化，我们就必须重新加载整个页面。

这很有用，因为现在的设备越来越不可预测：手机可以展开成平板电脑，笔记本电脑可以转换为平板电脑，您可以将键盘和鼠标插入到许多设备中……

如果您习惯了旧方法，感觉会不一样，但您在初始化程序中所做的任何事情很可能仍然可行，并且对变化的功能反应更灵敏。

您现在可以做到，因为它更加细粒度，您可以在同一个模板内有条件地显示/隐藏内容，而不是替换整个内容。例如，我们的功能服务中现在有一个视口（viewport）对象……

在一个模板中……

{{#if this.capabilities.viewport.lg}}
  大型屏幕的内容
{{/if}}

{{#if this.capabilities.viewport.sm}}
  非常小屏幕的内容
{{/if}}

或者在 JavaScript 中……

get myContent() {
  if (this.capabilities.viewport.sm) {
    return "short content";
  } else {
    return "the very very long content"
  }
}

然后在 CSS 中，您可以使用相同的断点对齐，例如……

@use "lib/viewport";

.my-element {
  font-size: 1em;
  @include viewport.until(sm) {
     font-size: 2em;
  } 
}
5 个赞
6

当然，我了解这些替换。

但我更期待看到这类模式被更根本地使用。

比如，如果我的主页在桌面上是“分类”，我可以看到一个“主题列表”。

按理说，“主题列表”在移动设备上也应该显示……目前你失去了“主题列表”元素。

这就是“强制移动主页”技术委员会（TC）存在的原因……

我希望我表达清楚了……

3 个赞
7

是的，有道理，我认为我们将逐步进行支持性的更改……只是因为我们已经用旧方法构建了太多东西，并且必须以不立即破坏定制化的方式来支持它们，所以这很棘手。

3 个赞