UIStretch Oddities

[duncanx]

Lets say I want to scale a button so I use a UIStretch. If I scale the background component of the button it's fine. However, then the collider doesn't get scaled and I wind up with a buggy button. So I put the UIStretch on teh button instead of just the Background texture...but now the button becomes enormous....not sure how big but looks like several hundred times larger than the screen. So...how is this supposed to work?

And btw - ImageButtons that have their images scaled, flicker when pressed (I suspect because the "pressed" image comes in, then later gets scaled instead of coming in already scaled).

[Malzbier]

I had the same problem but i created a script for that.

Just ad it to the Button gamobject and assign the background graphic to the targetTransform variable if the background sprite is not calld Background

(created for usage with UISlicedSprite background sprites)

1. using UnityEngine;
2. using System.Collections;
3.  
4. [ExecuteInEditMode]
5. [AddComponentMenu("NGUI/Helper/Collider Updater")]
6. public class UpdateCollider : MonoBehaviour
7. {
8.        
9.         public Transform targetTransform;
10.         private BoxCollider cachedCollider;
11.         public Vector2 sizeoffset = new Vector2 (1, 1);
12.         public float depth;
13.         /// <summary>
14.         /// Getting Stuff Cached
15.         /// </summary>
16.         void Start ()
17.         {
18.                 if (targetTransform == null) {
19.                         targetTransform = transform.FindChild ("Background");
20.                 }
21.                 if (this.GetComponent<BoxCollider> () != null) {
22.                         cachedCollider = this.GetComponent<BoxCollider> ();
23.                 }
24.         }
25.        
26.         /// <summary>
27.         /// Update the possition of the collider according to the sice of the target UISlicedSprite.
28.         /// </summary>
29.         void Update ()
30.         {
31.                 if (targetTransform != null) {
32.                         cachedCollider.size = new Vector3 (sizeoffset.x * targetTransform.localScale.x, sizeoffset.y * targetTransform.localScale.y, targetTransform.localScale.z);
33.                         cachedCollider.center = targetTransform.localPosition;
34.                         if (targetTransform.GetComponent<UISlicedSprite> () != null) {
35.                                 switch (targetTransform.GetComponent<UISlicedSprite> ().pivot) {
36.                                 case UIWidget.Pivot.Bottom:
37.                                         cachedCollider.center += new Vector3 (0, sizeoffset.y * targetTransform.localScale.y / -2, depth);
38.                                         break;
39.                                 case UIWidget.Pivot.BottomLeft:
40.                                         cachedCollider.center += new Vector3 (+sizeoffset.x * targetTransform.localScale.x / 2, sizeoffset.y * targetTransform.localScale.y / 2, depth);
41.                                         break;
42.                                 case UIWidget.Pivot.BottomRight:
43.                                         cachedCollider.center += new Vector3 (sizeoffset.x * targetTransform.localScale.x / -2, sizeoffset.y * targetTransform.localScale.y / 2, depth);
44.                                         break;
45.                                 case UIWidget.Pivot.Top:
46.                                         cachedCollider.center += new Vector3 (0, sizeoffset.y * targetTransform.localScale.y / -2, 0);
47.                                         break;
48.                                 case UIWidget.Pivot.TopLeft:
49.                                         cachedCollider.center += new Vector3 (sizeoffset.x * targetTransform.localScale.x / 2, sizeoffset.y * targetTransform.localScale.y / -2, depth);
50.                                         break;
51.                                 case UIWidget.Pivot.TopRight:
52.                                         cachedCollider.center += new Vector3 (sizeoffset.x * targetTransform.localScale.x / -2, sizeoffset.y * targetTransform.localScale.y / -2, depth);
53.                                         break;
54.                                 case UIWidget.Pivot.Left:
55.                                         cachedCollider.center += new Vector3 (sizeoffset.x * targetTransform.localScale.x / 2, 0, depth);
56.                                         break;
57.                                 case UIWidget.Pivot.Right:
58.                                         cachedCollider.center += new Vector3 (sizeoffset.x * targetTransform.localScale.x / -2, 0, depth);
59.                                         break;
60.                                 case UIWidget.Pivot.Center:
61.                                         cachedCollider.center += new Vector3 (cachedCollider.center.x, cachedCollider.center.y, depth);
62.                                         break;
63.                                 }
64.                         }
65.                 }
66.         }
67. }
68.  

[duncanx]

I got the colliders working using a similar solution.

But, I still don't know what to do about the flickering. An easy way to show the bug is to make an imagebutton that uses all the same image for the various states, then stretch it.

[ArenMook]

All you need to do is call NGUITools.AddWidgetCollider on the button after changing its size.

[duncanx]

Yea that's basically what I did (i peaked inside that method and pulled out the bit I needed). Any thoughts on the flickering?

[ArenMook]

UIImageButton uses MakePixelPerfect() after switching sprites, resizing the sprite to its native dimensions. This is intended, as rescaling a regular sprite distorts it, making it look ugly. You shouldn't be scaling regular sprites. Just sliced sprites.