http://wiki.nonip.net/index.php?title=Unity/UIImage/%E5%9F%BA%E6%9C%AC&feed=atom&action=history
Unity/UIImage/基本 - 変更履歴
2024-03-29T09:38:09Z
このウィキのこのページに関する変更履歴
MediaWiki 1.24.2
http://wiki.nonip.net/index.php?title=Unity/UIImage/%E5%9F%BA%E6%9C%AC&diff=16356&oldid=prev
Admin: /* 画像をタイル上に繰り返す */
2022-12-13T05:13:55Z
<p><span dir="auto"><span class="autocomment">画像をタイル上に繰り返す</span></span></p>
<table class='diff diff-contentalign-left'>
<col class='diff-marker' />
<col class='diff-content' />
<col class='diff-marker' />
<col class='diff-content' />
<tr style='vertical-align: top;'>
<td colspan='2' style="background-color: white; color:black; text-align: center;">←前の版</td>
<td colspan='2' style="background-color: white; color:black; text-align: center;">2022年12月13日 (火) 05:13時点における版</td>
</tr><tr><td colspan="2" class="diff-lineno">行115:</td>
<td colspan="2" class="diff-lineno">行115:</td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>==画像をタイル上に繰り返す==</div></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>==画像をタイル上に繰り返す==</div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>ImageのImageTypeをTiledへ</div></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>ImageのImageTypeをTiledへ</div></td></tr>
<tr><td colspan="2"> </td><td class='diff-marker'>+</td><td style="color:black; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;"></ins></div></td></tr>
<tr><td colspan="2"> </td><td class='diff-marker'>+</td><td style="color:black; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">==Image内のテキストの幅に合わせる==</ins></div></td></tr>
<tr><td colspan="2"> </td><td class='diff-marker'>+</td><td style="color:black; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">#Imageの下にTextを設置</ins></div></td></tr>
<tr><td colspan="2"> </td><td class='diff-marker'>+</td><td style="color:black; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">#ImageにContentSizeFitterをAddComponentで追加</ins></div></td></tr>
<tr><td colspan="2"> </td><td class='diff-marker'>+</td><td style="color:black; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">#HorizontalFitをPreferredSizeへ</ins></div></td></tr>
<tr><td colspan="2"> </td><td class='diff-marker'>+</td><td style="color:black; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">#HorizontalLayoutGrouをAddComponentで追加</ins></div></td></tr>
</table>
Admin
http://wiki.nonip.net/index.php?title=Unity/UIImage/%E5%9F%BA%E6%9C%AC&diff=15446&oldid=prev
Admin: /* 枠線を追加 */
2022-08-17T21:53:30Z
<p><span dir="auto"><span class="autocomment">枠線を追加</span></span></p>
<table class='diff diff-contentalign-left'>
<col class='diff-marker' />
<col class='diff-content' />
<col class='diff-marker' />
<col class='diff-content' />
<tr style='vertical-align: top;'>
<td colspan='2' style="background-color: white; color:black; text-align: center;">←前の版</td>
<td colspan='2' style="background-color: white; color:black; text-align: center;">2022年8月17日 (水) 21:53時点における版</td>
</tr><tr><td colspan="2" class="diff-lineno">行45:</td>
<td colspan="2" class="diff-lineno">行45:</td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>2.</div></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>2.</div></td></tr>
<tr><td class='diff-marker'>−</td><td style="color:black; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div>あとは、Shapes2dで、outlineSizeを0.<del class="diffchange diffchange-inline">02ぐらいにしてoutlineColorを黒にすれば良い。</del></div></td><td class='diff-marker'>+</td><td style="color:black; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div>あとは、Shapes2dで、outlineSizeを0.<ins class="diffchange diffchange-inline">02ぐらいにしてoutlineColorを黒にすれば良い。ただし、中身を透明にはできない。</ins></div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>3.</div></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>3.</div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>または、Shapes2Dで、Demos/ShowcaseのアイコンDemo Shapes/NoFillってやつを参照するとよい。1x1の画像を使って、Scaleで調整したりする。</div></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>または、Shapes2Dで、Demos/ShowcaseのアイコンDemo Shapes/NoFillってやつを参照するとよい。1x1の画像を使って、Scaleで調整したりする。</div></td></tr>
<tr><td colspan="2"> </td><td class='diff-marker'>+</td><td style="color:black; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">プレイ時だけ、中身が埋まってしまうときは、OutlineSizeを小さくするとうまくいく。</ins></div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>4.</div></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>4.</div></td></tr>
</table>
Admin
http://wiki.nonip.net/index.php?title=Unity/UIImage/%E5%9F%BA%E6%9C%AC&diff=15445&oldid=prev
Admin: /* 枠線を追加 */
2022-08-17T21:13:22Z
<p><span dir="auto"><span class="autocomment">枠線を追加</span></span></p>
<table class='diff diff-contentalign-left'>
<col class='diff-marker' />
<col class='diff-content' />
<col class='diff-marker' />
<col class='diff-content' />
<tr style='vertical-align: top;'>
<td colspan='2' style="background-color: white; color:black; text-align: center;">←前の版</td>
<td colspan='2' style="background-color: white; color:black; text-align: center;">2022年8月17日 (水) 21:13時点における版</td>
</tr><tr><td colspan="2" class="diff-lineno">行48:</td>
<td colspan="2" class="diff-lineno">行48:</td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>3.</div></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>3.</div></td></tr>
<tr><td class='diff-marker'>−</td><td style="color:black; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div><del class="diffchange diffchange-inline">または、Shapes2Dで、サンプルのNoFillってやつを参照するとよい。1x1の画像を使って、Scaleで調整したりする。</del></div></td><td class='diff-marker'>+</td><td style="color:black; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins class="diffchange diffchange-inline">または、Shapes2Dで、Demos/ShowcaseのアイコンDemo Shapes/NoFillってやつを参照するとよい。1x1の画像を使って、Scaleで調整したりする。</ins></div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>4.</div></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>4.</div></td></tr>
</table>
Admin
http://wiki.nonip.net/index.php?title=Unity/UIImage/%E5%9F%BA%E6%9C%AC&diff=15444&oldid=prev
Admin: /* 枠を追加 */
2022-08-17T13:29:46Z
<p><span dir="auto"><span class="autocomment">枠を追加</span></span></p>
<table class='diff diff-contentalign-left'>
<col class='diff-marker' />
<col class='diff-content' />
<col class='diff-marker' />
<col class='diff-content' />
<tr style='vertical-align: top;'>
<td colspan='2' style="background-color: white; color:black; text-align: center;">←前の版</td>
<td colspan='2' style="background-color: white; color:black; text-align: center;">2022年8月17日 (水) 13:29時点における版</td>
</tr><tr><td colspan="2" class="diff-lineno">行33:</td>
<td colspan="2" class="diff-lineno">行33:</td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>参考:https://teratail.com/questions/42899</div></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>参考:https://teratail.com/questions/42899</div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"></td></tr>
<tr><td class='diff-marker'>−</td><td style="color:black; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div>==<del class="diffchange diffchange-inline">枠を追加</del>==</div></td><td class='diff-marker'>+</td><td style="color:black; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div>==<ins class="diffchange diffchange-inline">枠線を追加</ins>==</div></td></tr>
<tr><td class='diff-marker'>−</td><td style="color:black; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div><del class="diffchange diffchange-inline">以下で外枠を追加できるが、Imageを透明にするとOutlineも消えてしまう・・。</del></div></td><td class='diff-marker'>+</td><td style="color:black; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins class="diffchange diffchange-inline">以下で外枠線を追加できるが、Imageを透明にするとOutlineも消えてしまう・・。</ins></div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div><pre></div></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div><pre></div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>Outline outline =imageObj.AddComponent<Outline>();</div></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>Outline outline =imageObj.AddComponent<Outline>();</div></td></tr>
</table>
Admin
http://wiki.nonip.net/index.php?title=Unity/UIImage/%E5%9F%BA%E6%9C%AC&diff=14462&oldid=prev
Admin: /* 画像ロード */
2021-12-03T00:21:43Z
<p><span dir="auto"><span class="autocomment">画像ロード</span></span></p>
<table class='diff diff-contentalign-left'>
<col class='diff-marker' />
<col class='diff-content' />
<col class='diff-marker' />
<col class='diff-content' />
<tr style='vertical-align: top;'>
<td colspan='2' style="background-color: white; color:black; text-align: center;">←前の版</td>
<td colspan='2' style="background-color: white; color:black; text-align: center;">2021年12月3日 (金) 00:21時点における版</td>
</tr><tr><td colspan="2" class="diff-lineno">行59:</td>
<td colspan="2" class="diff-lineno">行59:</td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>  Sprite iconImage = Resources.Load<Sprite>("hoge/image");</div></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>  Sprite iconImage = Resources.Load<Sprite>("hoge/image");</div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>  img.sprite = iconImage;</div></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>  img.sprite = iconImage;</div></td></tr>
<tr><td colspan="2"> </td><td class='diff-marker'>+</td><td style="color:black; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;"></ins></div></td></tr>
<tr><td colspan="2"> </td><td class='diff-marker'>+</td><td style="color:black; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">==Texture2DをSpriteへ==</ins></div></td></tr>
<tr><td colspan="2"> </td><td class='diff-marker'>+</td><td style="color:black; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;"><pre></ins></div></td></tr>
<tr><td colspan="2"> </td><td class='diff-marker'>+</td><td style="color:black; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">Texture2D tex = new Texture2D(256, 256);</ins></div></td></tr>
<tr><td colspan="2"> </td><td class='diff-marker'>+</td><td style="color:black; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">Sprite sprite = Sprite.Create(tex, new Rect(0, 0, tex.width, tex.height), Vector2.zero);</ins></div></td></tr>
<tr><td colspan="2"> </td><td class='diff-marker'>+</td><td style="color:black; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;"></pre></ins></div></td></tr>
<tr><td colspan="2"> </td><td class='diff-marker'>+</td><td style="color:black; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;"></ins></div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>==画像ロード(slice対応)==</div></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>==画像ロード(slice対応)==</div></td></tr>
<tr><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>  GameObject imageObj = GameObject.Find("HogeImage");</div></td><td class='diff-marker'> </td><td style="background-color: #f9f9f9; color: #333333; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #e6e6e6; vertical-align: top; white-space: pre-wrap;"><div>  GameObject imageObj = GameObject.Find("HogeImage");</div></td></tr>
</table>
Admin
http://wiki.nonip.net/index.php?title=Unity/UIImage/%E5%9F%BA%E6%9C%AC&diff=14292&oldid=prev
Admin: ページの作成:「 ==幅修正== GameObject graph = GameObject.Find("/Canvas/Graph"); RectTransform textRect = graph.GetComponent<RectTransform>(); textRect.sizeDelta = new Vector2(1000...」
2021-10-29T13:08:53Z
<p>ページの作成:「 ==幅修正== GameObject graph = GameObject.Find("/Canvas/Graph"); RectTransform textRect = graph.GetComponent<RectTransform>(); textRect.sizeDelta = new Vector2(1000...」</p>
<p><b>新規ページ</b></p><div><br />
==幅修正==<br />
GameObject graph = GameObject.Find("/Canvas/Graph");<br />
RectTransform textRect = graph.GetComponent<RectTransform>();<br />
textRect.sizeDelta = new Vector2(1000.0f, 1000.0f);<br />
<br />
==幅と高さ==<br />
float width = gameObject.GetComponent<RectTransform>().sizeDelta.x; // 幅<br />
float height = gameObject.GetComponent<RectTransform>().sizeDelta.y; // 高さ<br />
<br />
==UiImage複製して配置==<br />
*Canvas/CopySourceImageにコピー元Image設置<br />
*NewImageが新しくできるImage<br />
<pre><br />
GameObject canvas = GameObject.Find("Canvas");<br />
GameObject copySourceImage = GameObject.Find("Canvas/CopySourceImage");<br />
GameObject newImage = new GameObject("NewImage");<br />
newImage.transform.SetParent(canvas.transform, false);<br />
newImage.transform.SetSiblingIndex(copySourceImage.transform.GetSiblingIndex());<br />
RectTransform baseTransform = copySourceImage.transform as RectTransform;<br />
RectTransform rectTransform = newImage.AddComponent<RectTransform>();<br />
rectTransform.anchorMax = baseTransform.anchorMax;<br />
rectTransform.anchorMin = baseTransform.anchorMin;<br />
rectTransform.anchoredPosition = baseTransform.anchoredPosition;<br />
rectTransform.sizeDelta = baseTransform.sizeDelta;<br />
rectTransform.localScale = baseTransform.localScale;<br />
rectTransform.localPosition = baseTransform.localPosition;<br />
rectTransform.localRotation = baseTransform.localRotation;<br />
Image img = newImage.AddComponent<Image>();<br />
img.sprite = copySourceImage.GetComponent<Image>().sprite;<br />
</pre><br />
<br />
参考:https://teratail.com/questions/42899<br />
<br />
==枠を追加==<br />
以下で外枠を追加できるが、Imageを透明にするとOutlineも消えてしまう・・。<br />
<pre><br />
Outline outline =imageObj.AddComponent<Outline>();<br />
outline.effectColor = new Color(1, 0f, 0f, 1f);<br />
</pre><br />
他いくつかやり方がある。<br />
<br />
1.<br />
どこか一辺だけの場合は、以下参照すればできるかも。http://aktaat.hatenablog.com/entry/2016/10/30/085534<br />
<br />
2.<br />
あとは、Shapes2dで、outlineSizeを0.02ぐらいにしてoutlineColorを黒にすれば良い。<br />
<br />
3.<br />
または、Shapes2Dで、サンプルのNoFillってやつを参照するとよい。1x1の画像を使って、Scaleで調整したりする。<br />
<br />
4.<br />
imagetypeをslicedにして、中身を透明にすればできる。参考:https://hiyotama.hatenablog.com/entry/2015/06/25/090000<br />
<br />
==画像ロード==<br />
Resourcesの中にhoge/image.pngを入れる<br />
GameObject imageObj = GameObject.Find("HogeImage");<br />
Image img = imageObj.GetComponent<Image>();<br />
Sprite iconImage = Resources.Load<Sprite>("hoge/image");<br />
img.sprite = iconImage;<br />
==画像ロード(slice対応)==<br />
GameObject imageObj = GameObject.Find("HogeImage");<br />
Image img = imageObj.GetComponent<Image>();<br />
Sprite[] sprites = Resources.LoadAll<Sprite>("hogefile");<br />
Sprite iconImage = System.Array.Find<Sprite>( sprites, (sprite) => sprite.name.Equals("hogefile_1"));<br />
img.sprite = iconImage;<br />
<br />
==円のゲージ描画==<br />
#Imageに丸画像を追加<br />
#ImageTypeをFilledへ<br />
#FillOriginをTopへ<br />
#FillAmountを0~1へ<br />
<br />
<pre><br />
GameObject circleObj = GameObject.Find("CircleOnImage");<br />
Image circleImage = circleObj.GetComponent<Image>();<br />
circleImage.fillAmount = 0.5f; // 0~1<br />
</pre><br />
<br />
参考:https://clrmemory.com/programming/unity/circle-gauge-meter-p1/<br />
<br />
==画像付きボタンの角を引き伸ばさないように==<br />
正方形の画像を、縦長、横長にしても、角が伸びないようにする<br />
<br />
# 画像ファイルを選択し、StripeModeをSimpleからMultipleにし、SpriteEditorボタンを押す。<br />
# Sliceタブを選択肢、Sliceボタンを押し、Applyボタンを押し、緑の線を中央に寄せる。<br />
# 画像オブジェクトを選択し、ImageのImageTypeをSampleからSlicedに変更する<br />
<br />
参考:https://qiita.com/lycoris102/items/98bc5a5659e4889dd43f<br />
<br />
コードだとこんな感じ(Resourcesからロードして、SourceImageにはめる。<br />
<pre><br />
Image img = btnObj.GetComponent<Image>();<br />
if (img != null)<br />
{<br />
img.type = Image.Type.Sliced;<br />
img.pixelsPerUnitMultiplier = 3f; // 等倍であれば1、例ではサイズを3倍に<br />
Sprite[] sprites = Resources.LoadAll<Sprite>("status_bg");<br />
if (sprites != null)<br />
{<br />
Sprite sprite = System.Array.Find<Sprite>(sprites, (sprite) => sprite.name.Equals("status_bg_0"));<br />
img.sprite = sprite;<br />
}<br />
}<br />
</pre><br />
<br />
==画像をタイル上に繰り返す==<br />
ImageのImageTypeをTiledへ</div>
Admin