swift - 动态 View 取决于自由形式移动的 View 数量

Question

我不确定如何表达这个所以请耐心等待 :p

这是我想要实现的想法的屏幕截图，但我不确定如何最好地处理或描述它。

我可以在 React Native 或原生 iOS 中完成，所以无论哪个领域的想法都会很棒。

想法是，当房间里只有一个人时，您的视频会更大一些，当人们加入时，他们会根据手机适当缩放，并放置在有趣的布局中(不必完全如图所示, 只是他们的想法是根据设备大小和房间里的人数来扩展以占用尽可能好的空间)

我认为某种游戏引擎对此很有用，但不确定。如果您能抛出一些我可以用来处理它的搜索词，那就太好了。

我也可能希望它们是可拖动/可调整大小的，但我可以稍后再做，但我的想法是它们在特定容器尺寸内更自由地移动。

Answer 1

这是基本的网格功能，您只需为每个大小调整选项创建样式用例，并根据聊天室中的人数动态更改类...以非常基本的形式:

.6-user-layout {
    height: 60px;
    width: 60px;
}
.4-user-layout {...}
.2-user-layout {...}

作为你的基本样式 ^ 然后简单地动态交换你的类:

const sizingClass = \`${userCount}-user-layout\`;

return (
    <YourVideo classNames={sizingClass} />
);

除非你正在寻找一些非常具体的方法，否则这是一种使用 React 的简单方法，无论浏览器还是移动设备:)

这同样适用于任何游戏引擎，只需为每个用户数量定义您的样式要求或创建一个简单的方程式来计算它，同时跟踪活跃用户。