Tasharen Entertainment Forum

Support => NGUI 3 Documentation => Topic started by: ArenMook on November 21, 2013, 01:32:39 AM

Title: UIStretch
Post by: ArenMook on November 21, 2013, 01:32:39 AM
*** Deprecated in 3.0.7 ***

This component has been deprecated in NGUI version 3.0.7. Widgets (http://www.tasharen.com/forum/index.php?topic=6702) and Panels (http://www.tasharen.com/forum/index.php?topic=6705) have a new Anchor section.

Overview

UIStretch makes it possible to stretch widgets relative to other widgets or the camera's view rectangle. When used together with UIAnchor (http://www.tasharen.com/forum/index.php?topic=6712) it makes it possible to create modular UIs in NGUI 3.0.6 and earlier.

(http://www.tasharen.com/ngui/uistretch.jpg)

Have you ever wanted to have one of your widgets automatically adjust its size to match another widget's size? Most basic example being a label inside a button. Well, you can!

Going with the button example, if you have a button's background specified by a sliced sprite, and a child label underneath it, you can put a UIStretch script on the label, choose the background as the Container, and set the Style to be "Both". Give it some Border Padding, and you're done! Now when you resize the background, the label will also be resized accordingly.

Pro-Tip

You can combine anchors with stretch scripts to create modular UIs:
http://www.youtube.com/watch?v=q1C5NwZasGs

Class Documentation

http://tasharen.com/ngui/docs/class_u_i_stretch.html

If you have a question regarding this component or would like me to clarify something, just post a reply here.
Title: Re: UIStretch
Post by: Messu on November 27, 2013, 11:27:52 AM
Hi,
I would like to have kind of pictures to show how things work with different options. I guess it would be useful for others and not only me.
Title: Re: UIStretch
Post by: dominus85 on December 03, 2013, 03:37:52 AM
I import a 4:3 (1024x768) sprite and apply UIStretch to it
Style: FillKeepingRatio
The image automatically gets resized to a square and the dimensions are the same, without me being able to click snap..

The only way to keep it 4:3 and not 1:1 is to say the initial size is 4:3.. Is this normal or a bug?

Thanks
Title: Re: UIStretch
Post by: SamK on April 01, 2014, 07:30:14 AM
Hi Aren,
Whats the alternative of doing the same functionality in NGUI 3.0.7. ??
Although UIStretch is still searchable in the project window I haven't tried it after reading this.
I want to scale up/down a BG.
if i'm not wrong i think the type drop down in the anchor part has something to do with it. "unified and advanced"

Thanks

Title: Re: UIStretch
Post by: ArenMook on April 01, 2014, 10:58:21 AM
All widgets have built-in anchoring functionality now, and you should be using those instead of UIAnchor/UIStretch. The video tutorial explaining the layout system explains how to use them, so start with that.
Title: Re: UIStretch
Post by: ababab5 on November 25, 2014, 08:10:44 PM
Hi,

I tried to create a chat. Each chat have - of course - a label.

My problem is I can resize the label dynamically with the option " resize height " but I want to adapt the width too, in a certain limit.


For example, I want to have a width max of 200 pixels, and if my text of longer than that (the font size is constant), the UILabel add a new line (so at this moment I get a bigger height).


If fact it's what all the chat (Facebook, whatsapp etc... ) did.

I'm sure I can do that, but I really ... Really! ... Don't understand how.


Thank you very much for your help.


Best regards,

AB
Title: Re: UIStretch
Post by: ArenMook on November 26, 2014, 09:03:27 PM
I do that in Windward for tooltips. I have the height at Resize Freely, but width changes depending on the content.

What I do is simple. I set the label's overflow method to ResizeFreely, set its text, then check its printedSize. I then make a decision for what its width should be, change its overflow method back to ResizeHeight, and set the width.
  1.                                 comparisonLabel.overflowMethod = UILabel.Overflow.ResizeFreely;
  2.                                 comparisonLabel.text = ttCompare;
  3.                                 comparisonLabel.gameObject.SetActive(true);
  4.  
  5.                                 // Don't let the comparison label to get too small
  6.                                 if (comparisonLabel.printedSize.x < 80f)
  7.                                 {
  8.                                         comparisonLabel.overflowMethod = UILabel.Overflow.ResizeHeight;
  9.                                         comparisonLabel.width = 80;
  10.                                 }
  11.                                 else if (comparisonLabel.printedSize.x > 200f)
  12.                                 {
  13.                                         comparisonLabel.overflowMethod = UILabel.Overflow.ResizeHeight;
  14.                                         comparisonLabel.width = 200;
  15.                                 }
No UIStretch needed. Not sure why you posted here.