「Unity/UIImage」の版間の差分
提供: 初心者エンジニアの簡易メモ
(→枠を追加) |
(→円のゲージ描画) |
||
行69: | 行69: | ||
参考:https://clrmemory.com/programming/unity/circle-gauge-meter-p1/ | 参考:https://clrmemory.com/programming/unity/circle-gauge-meter-p1/ | ||
+ | |||
+ | ==画像付きボタンの角を引き伸ばさないように== | ||
+ | 正方形の画像を、縦長、横長にしても、角が伸びないようにするには、 | ||
+ | ImageのImageTypeをSampleからSlicedに変更する |
2021年8月26日 (木) 02:19時点における版
幅修正
GameObject graph = GameObject.Find("/Canvas/Graph"); RectTransform textRect = graph.GetComponent<RectTransform>(); textRect.sizeDelta = new Vector2(1000.0f, 1000.0f);
幅と高さ
float width = gameObject.GetComponent<RectTransform>().sizeDelta.x; // 幅 float height = gameObject.GetComponent<RectTransform>().sizeDelta.y; // 高さ
UiImage複製して配置
- Canvas/CopySourceImageにコピー元Image設置
- NewImageが新しくできるImage
GameObject canvas = GameObject.Find("Canvas"); GameObject copySourceImage = GameObject.Find("Canvas/CopySourceImage"); GameObject newImage = new GameObject("NewImage"); newImage.transform.SetParent(canvas.transform, false); newImage.transform.SetSiblingIndex(copySourceImage.transform.GetSiblingIndex()); RectTransform baseTransform = copySourceImage.transform as RectTransform; RectTransform rectTransform = newImage.AddComponent<RectTransform>(); rectTransform.anchorMax = baseTransform.anchorMax; rectTransform.anchorMin = baseTransform.anchorMin; rectTransform.anchoredPosition = baseTransform.anchoredPosition; rectTransform.sizeDelta = baseTransform.sizeDelta; rectTransform.localScale = baseTransform.localScale; rectTransform.localPosition = baseTransform.localPosition; rectTransform.localRotation = baseTransform.localRotation; Image img = newImage.AddComponent<Image>(); img.sprite = copySourceImage.GetComponent<Image>().sprite;
参考:https://teratail.com/questions/42899
枠を追加
以下で外枠を追加できるが、Imageを透明にするとOutlineも消えてしまう・・。
Outline outline =imageObj.AddComponent<Outline>(); outline.effectColor = new Color(1, 0f, 0f, 1f);
どこか一辺だけの場合は、以下参照すればできるかも。http://aktaat.hatenablog.com/entry/2016/10/30/085534
あとは、Shapes2Dでできそう。サンプルのNoFillってやつを参照するとよい。1x1の画像を使って、Scaleで調整したりする。
画像ロード
Resourcesの中にhoge/image.pngを入れる
GameObject imageObj = GameObject.Find("HogeImage"); Image img = imageObj.GetComponent<Image>(); Sprite iconImage = Resources.Load<Sprite>("hoge/image"); img.sprite = iconImage;
画像ロード(slice対応)
GameObject imageObj = GameObject.Find("HogeImage"); Image img = imageObj.GetComponent<Image>(); Sprite[] sprites = Resources.LoadAll<Sprite>("hogefile"); Sprite iconImage = System.Array.Find<Sprite>( sprites, (sprite) => sprite.name.Equals("hogefile_1")); img.sprite = iconImage;
円のゲージ描画
- Imageに丸画像を追加
- ImageTypeをFilledへ
- FillOriginをTopへ
- FillAmountを0~1へ
GameObject circleObj = GameObject.Find("CircleOnImage"); Image circleImage = circleObj.GetComponent<Image>(); circleImage.fillAmount = 0.5f; // 0~1
参考:https://clrmemory.com/programming/unity/circle-gauge-meter-p1/
画像付きボタンの角を引き伸ばさないように
正方形の画像を、縦長、横長にしても、角が伸びないようにするには、 ImageのImageTypeをSampleからSlicedに変更する