Tasharen Entertainment Forum

Support => NGUI 3 Support => Topic started by: vexe on November 09, 2013, 12:32:09 PM

Title: How to Create a modular clipped panel? (resizes correctly with its container)
Post by: vexe on November 09, 2013, 12:32:09 PM
Hey guys,

so I watched the "how to make a modular UI" video, and I quite like it.

My attempts have been successful, at creating even more complex UIs than the one presented in the video.
But one thing I failed to "modularize", is the clipped panel.

So let's say I have an inventory with an inner window for my contents (see attachment), what I'd like to be able to do, is resize the inner window, and have the clipped panel resize itself accordingly and correctly.

I tried doing the same thing, attaching a UIAnchor and UIStretch scripts to it, but it didn't work, it didn't resize properly.

And it is really annoying to having to resize it every time I resize my windows, especially since it's a clipped panel.

Thanks for your time and any help or suggestions.
Title: Re: How to Create a modular clipped panel? (resizes correctly with its container)
Post by: ArenMook on November 09, 2013, 07:23:34 PM
UIStretch is able to resize clipped panels, but what are you using for the container? Whatever it is, it can't be a child of the panel.

Also keep in mind the way clipping is specified and works is going to be changed very soon -- possibly even the next public release. I'm in Copenhagen for the Hack Week for the next week though, so won't get any time to work on it until after.
Title: Re: How to Create a modular clipped panel? (resizes correctly with its container)
Post by: vexe on November 12, 2013, 02:59:32 AM
Thanks for your input, and sorry for my late reply.

Yes, you are correct, a panel do resize correctly thus it can be made modular - Done the same by using a combo of UIAnchor and UIStretch scripts.

And no, the container isn't a child of the panel.
  1. Items Window
  2. --- Inner - Background (This is the container of the clipped panel)
  3. --- Inner - Glow
  4. (Panel) - Clipped
  5. --- Items
  6.  

However, when I use an anchor on the panel, I can't seem to scroll my items correctly, very strange behavior! - The scrolling acts naturally back if I disable the Anchor script on the panel, but if I do so, it won't resize correctly when resizing its container... :(

So I thought, oh well it must be because that the items is a child of the panel, so if I put the items somewhere else, this should solve it... I was wrong, it didn't.

I wanted to make a small video about this, but as I was making it, I ran into other very strange issues as well, for the first time...
Please have a look, as it might give you more things to consider in your next release: http://www.youtube.com/watch?v=0fQDj1bPCkI&feature=youtu.be

Your reply is very appreciated. Thanks.
Title: Re: How to Create a modular clipped panel? (resizes correctly with its container)
Post by: ArenMook on November 12, 2013, 03:07:45 PM
Yup, more oddities stemming from the current implementation. Next major update should resolve them by changing the clipping.
Title: Re: How to Create a modular clipped panel? (resizes correctly with its container)
Post by: vexe on November 12, 2013, 03:19:47 PM
By major you mean 3.1 or 3.0.6?
Title: Re: How to Create a modular clipped panel? (resizes correctly with its container)
Post by: ArenMook on November 12, 2013, 03:38:12 PM
3.0.6.
Title: Re: How to Create a modular clipped panel? (resizes correctly with its container)
Post by: vexe on November 28, 2013, 01:54:17 AM
I was so excited to check out the new clipping. Well it's here - Although clipping is now easier - much like a widget. But the issues remain the same - Scrolling is still messed up (unless I remove the UIAnchor) - And even more weird stuff is there as well! (Notice how in the beginning of the video, the panel was moving by itself! - I wanted to catch that on video, but managed to only get the end of it, it's .... alive! lol)- Though resizing still works well, much the same. I can't see how this clipped panel is any better than the old, besides the ease to change the clipped panel size like a widget.

Please watch this video: http://www.youtube.com/watch?v=1KV-c5NFjpM

You could easily reproduce what I have.

Hoping to see those issues resolved in the very near future, for GOOD.

Thanks.
Title: Re: How to Create a modular clipped panel? (resizes correctly with its container)
Post by: ArenMook on November 28, 2013, 03:34:10 PM
What are you anchoring in there? You shouldn't anchor scroll views.
Title: Re: How to Create a modular clipped panel? (resizes correctly with its container)
Post by: vexe on November 28, 2013, 10:49:08 PM
If I don't anchor it, it wouldn't be modular anymore - which is the whole point here... How am I supposed to make it modular, without the anchoring?
Title: Re: How to Create a modular clipped panel? (resizes correctly with its container)
Post by: Jodon on November 29, 2013, 12:48:17 AM
This is pretty much the same issue I mentioned in my thread with possible fixes:  http://www.tasharen.com/forum/index.php?topic=6735.0
UIAnchor and UIStretch should take into account their hierarchy and know when their parent's in position so they can then stretch or anchor.
Title: Re: How to Create a modular clipped panel? (resizes correctly with its container)
Post by: vexe on December 05, 2013, 06:10:07 AM
OK - I found a good solution to my problem - It's OK to anchor the ScrollView (ClippedPanel) - But let the anchor only execute once. So that during the editing time we get full modularity - and then the anchor runs once when the game runs, does its thing, and deactivates - now scrolling works nice, no problems :)
Title: Re: How to Create a modular clipped panel? (resizes correctly with its container)
Post by: ArenMook on December 05, 2013, 03:26:04 PM
Oh the note of anchoring scroll views... the 3.0.7 layout system re-design now lets you anchor scroll views same way as widgets (by using the new system).