Weird results when trying to get UI elements to fit a dynamic size in Unity - layout

I have a system where if you walk by a sign it will create a popup dialogue which is fine (just the popup part) but when I try to make it to where it can be adjusted based on how much text is displayed (Content Size Fitter) then I get something that literally does not make any sense to me whatsoever. When using World Space my font on Text components has to be 0 (also makes no sense) so that 1 letter isn't the size of 100 units and the combination of these 2 issues has almost made me go mad but that is the reason why I am here so you all can save me!
My setup for my sign :
Now this is the dialogue that is spawned viewed from the inspector (Not shown in the scene/game view yet) :
Now this is when the player walks near the sign with all the components you see in the screenshots :
As you can see the height of my dialoguePanel for some reason keeps going to 321 and New Years isn't close so this countdown I am not happy with. It should be adjusting to how much text is in it. I mean I just did a tooltip almost 100% identical except that the Canvas isn't World Space but Screen Space - Overlay. On top of all this it seems any text I use in World Space HAS to be font 0. Please help I am about to lose my mind.

World space canvas is a bit tricky. And guess what is even more tricky: content size fitter. One of solutions is that you add your dialog UI element manually in the scene at desired location and tweak its RectTransform values in inspector to get what you want to see in scene view and then save it as prefab.
Read more about How Content Size Fitter works and there is one more thing about UI when working with world space canvas. UI is way too bigger than your other scene elements. To solve this problem you have to scale it down as instructed in section Specify the size of the Canvas in the world.
Hope it helps :)

Related

move image inside imageview getting bounderies

i am working on a app and in 1 option i can load a photo to display when you scroll through items.
The permissions and loading all works fine.
Now my photo is bigger than the imageview so i want that the user can "move" the photo to display the section he/she wants to show.
Again implementing the onTouchListerner and scrolling the photo works fine.
The problem is where to stop the moving of the photo.
I the picture above the grey part is my photo. In my case 2560x1920.
The red part is my imageview (match_parent x 85dp => 1368x255)
I have my scaletype set to CENTER_CROP resulting in a scalefactor of 0.534375
when i scroll in the image ( scrollBy(x,y) ) i can see my Y moves between -390..390 (or close by, hard to see). But that is of course only the case for this specific photo. But no matter which adding/substracting/dividing/... is do i can not seem to find out how the get this limit becuause what is absolutly do not want is the right situation in the picture above.
Does anybody have an idea to figure this out.
I found some (not a lot) examples that are suppose to work but they do not.
Mostly they work by keeping to total somewhere but still having a total is not of much use if you do not no the min/max.
ps. if possible at all (please please) a java example and not kotlin

How to use/get Apple Watch Full Screen mode

I don't want to hide time, but want to use full screen
In the storyboard on the interface controller settings I set the checkbox "Full Screen" and "Fixed to screen edges" to ON.
In the storyboard I can see the full screen mode is working and the WKInterfaceGroup is scaled to the entire display.
But unfortunately on the watch device/simulator it does not work.
The group has alignment center/center OR center/top and width and height are set to "Relative to Container"
How can I really use the full screen mode?.
I just have to add a label equal to Time in top black space. I want to show some text here. I have seen this in some other apps, They are using this space. Even in Apple design guide lines docs, they use this space. I am adding these reference screenshots also.
In above pictures, you can see they used this top space for titles. I also want to add a label to show some text equal to time.
Any help would be greatly appreciated.
This is a really weird bug. After digging around I've found a way to fill the whole screen. It's not pretty but I'm consistently getting full screen if i'm adding a sprite kit scene into a "main group". Again; it's not an elegant fix but it works and isn't really that resource intensive. Hope this works for you too!

Layout of text/spacing changes in TextArea when clicking on it

I have a CodenameOne application which has a TextArea that should display a multi-line text.
When I run the app in the simulator and click on the text-area, the spacing between the lines and possibly also between the characters change so that the area that the text occupies shrinks a bit.
Why is this?
What should I do to prevent it?
That is due to the switch from our drawing to the native editing which will always render things slightly differently. E.g. things like line spacing are really hard to get accurately for every native device.
TextArea has a setRowsGap method that allows you to specify the spacing between rows in pixels but since this differs between OS's its probably not ideal.

iOS view size and position hard-coded only?

I'm new to Macs and iOS, I got my app running on webOS, Android, and WPF/Windows. In all cases the size of, say, a 'widget' to display a bunch of text, can change depending on the dimension of the text to be displayed, as well as the position can be up against another widget. As the text size changes, the position will change so that all the widgets are crammed together nicely.
I've been searching for this capability in IOS4 in books and on-line, and it's starting to look like in iOS, you have to actually calculate the size of the text to be displayed in ViewText and then change the dimensions of ViewText, which of course then bumps other Views around to accommodate this size change. It sounds like a nightmare. Isn't there some other way to do this (like all the other GUIs can do) to size based on content, and to position relative to other Views like stacking them all together whatever size they are?
Same with ScrollView, it looks like the size of the window you actually see has to be manually specified as well, instead of, say, taking up the entire viewable window and then you can populate the ScrollView with a bunch of sub-views, some of which are below the initially viewable area? I tried this in Xcode4, but so far, haven't gotten it to work.
Similarly with creating an object with a NIB and instantiating that NIB onto an existing View, how does it determine where to position this NIB onto the existing screen?
Thanks!
Paul,
For the scrollview you need to set the bounds so it fills the screen or the area you wish it to occupy, it will then automatically generate scrollbars based on the layout within it. In the land of iOS you do have to do extensive layout work such as positioning and sizing your controls but you can also use the UIAutoResize (if I remember correctly) masks such as if they are anchored to a size, fill the area, etc. It's a little complicated to learn initially but you'll get the hang of it.
As for text you just need to use the right control, I believe what you want is a UITextView and set the options on it as needed.
When you view a XIB it's going to layout initially as you have it, again, you need to position your controls AND set their anchors (autoresize masks) so they adjust based on the screen size (phone vs. pad) and orientation: landscape vs. portrait.
HTH

Silverlight 3 - Elements inside an element dont arrange sometimes

I have a grid/canvas that has an element (say an icon with an image and text overlayed) added to it dynamically via code.
Most of the time it renders correctly when added (content is aligned properly inside it),
but sometimes all the content sits in one corner.
I can remove/add/remove/add/remove/add and it will eventually do it
After a movement of the parent canvas, the element corrects itself as if the layout has been updated.
I have tried the following on Loaded and OnApplyTemplate for both the element and the element parent but it still seems to happen occasionally
InvalidateMeasure()
InvalidateArrange()
UpdateLayout()
Any ideas on why the content wouldn't arrange would be appreciated cause its driving me nuts
I'm not sure why it works for you sometimes but not others. But a grid has the inherent ability to dynamically resize itself and its contents. A canvas doesn't (you'd have to handle that manually in code).
If you change your canvas to a grid does it work? A grid has slightly more overhead than a canvas but it sounds to me like you need its functionality anyway.

Resources