3
\$\begingroup\$

I have a script that uses Index to change an object's sprite using OnClick to move through the sprites, like a slideshow. I want the image to scale to the size of my anchor points, because I've noticed that when I stretch the game or put the game on "maximize on play" the image stays the same size and doesn't scale to the size of my anchor points. How would I do that? This is my script:

public Sprite[] Images;
//Index starts at one because we are setting the first sprite in Start() method
public int _Index = 1;

void Start() {
    //Set the image to the first one
    this.gameObject.GetComponent<SpriteRenderer>().sprite = Images[0];
}

public void onClick(){
    //Reset back to 0 so it can loop again if the last sprite has been shown
    if (_Index >= Images.Length)
        _Index = 0;
    
    //Set the image to array at element index, then increment
    this.gameObject.GetComponent<SpriteRenderer>().sprite = Images[_Index++];
}
\$\endgroup\$

1 Answer 1

1
\$\begingroup\$

(code updated to integrate yours directly) This covers resizing the image, but it doesn't cover the aspect ratio. The aspect ratio could be easy (targetHeight = TargetWidth * (height/width)), or complex if you are trying to use more shaping features/positioning.

 public Sprite[] Images;

 //Index starts at one because we are setting the first sprite in Start() method
 public int _Index = 1;

 void Start(){
     //Set the image to the first one
     this.gameObject.GetComponent<SpriteRenderer>().sprite = Images[0];
 }
 
 public void onClick(){

     var renderer = GetComponent(SpriteRenderer);
     if (renderer == null) return;

     //Reset back to 0 so it can loop again if the last sprite has been shown
     if (_Index >= Images.Length)
         _Index = 0;

     //Set the image to array at element index, then increment
     renderer.sprite = Images[_Index++];
 
     transform.localScale = Vector3(1,1,1);
 
     var width = renderer.sprite.bounds.size.x;
     var height = renderer.sprite.bounds.size.y;
 
     var targetWidth = 16; // replace this with the code to get the width you want
     var targetHeight = 9; // replace this with the code to get the height you want

     transform.localScale.x = targetWidth / width;
     transform.localScale.y = targetHeight / height;
 }

However, You could just use the UI Image, which should scale with the screen size by default.

\$\endgroup\$
3
  • \$\begingroup\$ Thank you for your reply, Do I have to make a new script or add this into my script. :) \$\endgroup\$ Sep 1, 2016 at 19:31
  • \$\begingroup\$ I would add it to the end of your onClick method. And my first line, would be replaced by "var go = this.gameObject;" \$\endgroup\$ Sep 5, 2016 at 15:34
  • \$\begingroup\$ If this is UI I think it would be much better if the whole thing is setup using UI components and then properly setup RectTransform hierarchy will automatically handle it. \$\endgroup\$
    – Nikaas
    Sep 6, 2022 at 8:48

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .