Hey guys!
I'm making a power bar as a part of GUI. The power of shot will be calculated based on how long player is holding the fire button, and the bar will display the scale. I'm trying to achieve it with two textures of the same size.
Look at the picture.
The first (bottom) texture is for backing, and the other is for scale itself. The scale is partly transparent, and is drawn on the top of the backing. I'm going to clip the top texture with a rectangle which height will be calculated. I want just to display the lower part of the scale texture, not to stretch it, not to center it (marked desired result on the picture). But I can't find the way to do this.
The best I get is a very creepy thing (marked what i actually get on the pic). I use GUI.DrawTexture method with a scale mode ScaleMode.ScaleAndCrop, but what it does is moving the texture's center to the rectangle's center point (but i need moving the lower-left texture's angle to the rectangle's lower-left angle).
I wonder, is there a solution at all? I tried playing with Texture2D's set/get pixels, but it not an option because of its enormous impact on performance.
Here is the code that I'm using at the moment
// [field declarations] textures for fire power scaling
public Texture firebarBottom;
public Texture firebarScale;
...
// [inside OnGUI method] Where to draw fire bar
rect = new Rect(sidebarX + firebarX, firebarY,
firebarBottom.width, firebarBottom.height);
float offset = rect.height * (1 - powerScale);
// Rectangle for drawing firebar scale texture. Its height depends on shot power
Rect rect2 = new Rect(rect.x, rect.y + offset, rect.width, rect.height - offset);
GUI.DrawTexture(rect, firebarBottom);
GUI.DrawTexture(rect2, firebarScale, ScaleMode.ScaleAndCrop);
Thanks everyone!
Using GUI.DrawTextureWithTexCoords
Parameters
position: Represent position and “total” size of texture.
texCoords: Use percentage per unit. Relative Left-Lower corner, and relative scale.
Axes Origin
OnGUI origin is Left-Upper corner: position parameter use this origin.
But, in DrawTextureWithTexCoords the origin is Left-Lower corner: texCoords use this origin.
With texCoords parameter you can crop(percentage between 0-1) or tile image (width or height upper to 1).
To maintain aspect, also you must change “total” size of texture(position parameter).
Before this, you need save texture initial size(width,height).
using UnityEngine;
using System.Collections;
[ExecuteInEditMode]
public class NewBehaviourScript : MonoBehaviour {
public Texture image;
[Range(0f,1f)]
public float x=0f;
[Range(0f,1f)]
public float y=0f;
[Range(0f,1f)]
public float width=1f;
[Range(0f,1f)]
public float height=1f;
float initialWidth,initialHeight;
bool imageEnabled=false;
void Update(){
if(!this.imageEnabled) if(this.image!=null){
this.initialWidth = this.image.width;
this.initialHeight = this.image.height;
this.imageEnabled=true;
}
}
void OnGUI(){
if(imageEnabled){
Rect position = new Rect(0f,0f,this.initialWidth*this.width,this.initialHeight*this.height);
Rect coords = new Rect(this.x,this.y,this.width,this.height);
GUI.DrawTextureWithTexCoords(position,this.image,coords);
}
}
}
Here’s my attempt. Also uses GUI.DrawTextureWithTexCoords, probably about the same as what IsGreen did.
using UnityEngine;
using System.Collections;
public class PowerBarScript : MonoBehaviour {
public Texture PowerBarTexture;
public Vector2 PowerBarPosition;
public Vector2 PowerBarSize;
private float powerRatio = 0.5f;
void Update() {
Debug.Log(PowerBarTexture.height);
if(Input.GetKey(KeyCode.W)) {
powerRatio += 0.01f;
if(powerRatio > 1)
powerRatio = 1f;
}
if(Input.GetKey(KeyCode.S)) {
powerRatio -= 0.01f;
if(powerRatio < 0.01)
powerRatio = 0.01f;
}
}
void OnGUI() {
GUI.DrawTextureWithTexCoords(new Rect(PowerBarPosition.x, PowerBarPosition.y - (PowerBarSize.y * powerRatio), PowerBarSize.x, PowerBarSize.y * powerRatio), PowerBarTexture, new Rect(0, 0, 1, 1 * powerRatio));
}
}