简体   繁体   English

如何在不同的屏幕上将切换开关/按钮放入滚动面板

[英]how can I fit toggles/buttons into scrolled panel on different screens

I am trying to make a game in Unity3d 5. What I am trying to do right now is to make a scrollable panel filled with toggles/buttons. 我正在尝试在Unity3d 5中制作游戏。我现在正在试图做的是制作一个充满切换/按钮的可滚动面板。 The panel should fit the frame on the screen and is masked so it hides under image frame. 面板应适合屏幕上的框架并被遮盖,以便隐藏在图像框架下。 The concept is under this link: https://www.dropbox.com/s/9zxwx33orz46q60/Screenshot2.png?dl=0 该概念位于此链接下: https : //www.dropbox.com/s/9zxwx33orz46q60/Screenshot2.png?dl=0

As you can see I managed to make toggles fill the panel, but not exactly as it should be. 如您所见,我设法使切换开关充满了面板,但并不完全是应该的。 I us content size fitter on panel with both vertical and horizontal fitting set as preferred size. 我们使用面板上的内容尺寸装配工,将垂直和水平装配都设置为首选尺寸。 Also I put LayoutElement on panel and set min width and min height as 200. There is VerticalLAyoutGroup with only "Height" checked. 另外,我将LayoutElement放在面板上,并将最小宽度和最小高度设置为200。存在VerticalLAyoutGroup,仅选中了“ Height”。 The panel is filled during runtime with quite simple prefab. 该面板在运行时使用非常简单的预制件填充。 It has preferred width also set at 200. 它的首选宽度也设置为200。

So it would not be much problem but when I buid it and run on Galaxy S5 it looks like this: 因此,这不会有太大问题,但是当我将其绑定并在Galaxy S5上运行时,它看起来像这样:

https://www.dropbox.com/s/9zrv6kyf4n0ueam/Screenshot1.png?dl=0 https://www.dropbox.com/s/9zrv6kyf4n0ueam/Screenshot1.png?dl=0

So question is: how can I make it to always fit the panel? 问题是:如何使它始终适合面板? I was changing a lot of different setting and what I once managed to do was that toggles/prefabs did fit the width of the panel but did not keep aspect ratio about 3 (they were flat and unreadable. On other instances the panels overlap partially or completely. 我正在更改许多不同的设置,而我曾经设法做的是,肘节/预制件确实适合面板的宽度,但长宽比未保持在3左右(它们是平坦且不可读的。在其他情况下,面板部分重叠或完全。

Please help. 请帮忙。

EDIT 编辑

I managed to achieve this: 我设法做到这一点:

https://www.dropbox.com/s/6w80qnuekqyrx96/Screenshot3.png?dl=0 https://www.dropbox.com/s/6w80qnuekqyrx96/Screenshot3.png?dl=0

With settings as: 设置为:

Panel: 面板:

* Content Fitter:  horizontal - unconstrained, veertical - preferred size
* Child Force expand - both height and width checked
* Anchors and size stretched to fit scroll rect

Once again I struggle with something for few days, finally post a question here... and solve a problem in few minutes. 我再度挣扎了几天,终于在这里发布了一个问题...并在几分钟内解决了一个问题。

So the problem was in keeping aspect ration while resizing the prefab. 因此,问题在于在调整预制件的尺寸时保持宽高比。 When it was resized horizontally to fit panel it might be resized vertically too, but the position was not adjusted to compensate this change. 在水平调整尺寸以适合面板时,也可能在垂直方向调整了尺寸,但未调整位置以补偿此更改。 So what was needed was to change the preferred height of the prefab on the basis of panel width (could not use toggle width, since it was not right yet (not resized yet)). 因此,需要的是根据面板宽度更改预制件的首选高度(无法使用切换宽度,因为它尚不正确(尚未调整大小))。 In the code where I create togges for every toggle I had to put (3f is my aspect ratio): 在我必须为每个切换创建切换的代码中(3f是我的宽高比):

float width = contentPanel.GetComponent<RectTransform> ().rect.width;
newPower.GetComponent<LayoutElement> ().preferredHeight = width / 3f;

Other settings are: Panel uses vertical fit as preffered and horizontal as unconstricted Toggle uses aspect ratio fitter set as Width controls height and aspect as 3 其他设置包括:面板使用水平拟合作为首选,水平使用非收缩进行切换。切换使用宽高比拟合器设置为宽度,将高度和宽高比设置为3

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM