みつまめ杏仁

アンリアルエンジン(UE4)でGUIを作るためにゴニョゴニョしてます。UIデザイナーの皆様の助けになれば幸いです。

UE4でパーセント表記

戦績などのスコアを表示するリザルト画面や、武器やキャラのステータス表示で、「命中率」や「回避率」など「○○率」を表記することがよくあります。

この「○○率」を表示してやんよ~というわけで気軽にやってみたのですが、なかなかうまくいきませんでした。ははは。

 

例えば、命中率の計算。必要な情報は 『撃った弾数』と『当たった数』です。

基本的に『当たった数』を『撃った弾数』で割ればよいだけです。

100発100中なら100%と書けばいいのですが、300発100中ならどうなるでしょう。

 

100 ÷ 300 で 0.33333333333333333333333333・・・・

 

このように割り切れない場合があります。これを、33.33% と書きたいわけですよ。で、どうするか? 昔JavaScriptで覚えた方法を試します。

小数点以下2桁にしたい場合。

100 + 2桁のゼロ で 10000  まずは この 10000 を掛けてやります。

f:id:hiyokosabrey:20161123232534p:plain

ゼロが4つで、小数点が4つ移動します。上の場合 5898.7654

掛けた値を四捨五入します。四捨五入した時点で小数点以下は消えるので、整数になります。この時点で、4桁の整数になっています。 上の場合 5899

それをさらに 100 で割ります。小数点が右端から2つ移動します。

f:id:hiyokosabrey:20161123232833p:plain

PrintStringノードで表示してみます。

58.99 が表示されればバッチリです。

f:id:hiyokosabrey:20161123233418p:plain

な、なんじゃぁこりゃぁ。2はどこから?

ネットで調べてみると、どうもイロイロ事情があって仕方のないものらしい。

コンピュータは基本 0 と 1 の2進数で動いていて、この2進数で小数点を表すことが苦手なようで、上のような微妙な誤差が生まれるとのこと。お金の計算でこの誤差はヤバいのでさすがにちゃんと対策されているそうです。なるほど小数点を扱うのは結構難しいもんですね。ふふふ。

いやいや。表示しなきゃいけないのですよ。

で、思いついたのが、四捨五入した時の Int型の値を、String型(文字列)にして分割してしまう方法。

f:id:hiyokosabrey:20161123235510p:plain

整数同士の割り算は小数点以下を切り捨ててくれます。 上の場合  5899 ÷ 100 で 58。

f:id:hiyokosabrey:20161123235758p:plain

うまくいきました。

ただこの方法だと、 必ず小数以下の2桁分がくっつけられるので、割り切れたとしても最後に0が付きます。

0.5 の場合、0.5 × 10000 = 5000 になるので、 50.00% と表示することになります。

 

なんか面倒な感じがして釈然としないので、便利そうなノードが用意されてたりしないかな、ゲームエンジンなんだし・・・と思いつつ探してみたらありました。

AsPercent ノード。

f:id:hiyokosabrey:20161124000924p:plain

Epicありがとう!

Float型の値をパーセント表記に、しかもテキストで返してくれるというすぐれもの。

f:id:hiyokosabrey:20161124001330p:plain

Text型ということは、UMGのTextBlock でサクッとと表示できて便利です。結果は、

f:id:hiyokosabrey:20161124001531p:plain

おお!カンペキ! もっと早くに出会っていれば・・・(涙

右端の桁に 0 もつかないというシンプルさ。

f:id:hiyokosabrey:20161124001833p:plain

ちなみに、小数点以下を固定の桁で四捨五入するのを「丸める」といいます。

AsPercent ノードの設定で好きな桁で丸めることができます。

f:id:hiyokosabrey:20161124002806p:plain

Rounding Mode は丸める方法です。

詳しくはWikipediaで。(端数処理

 

ということで無事解決しました。

プログラマにテキストで頂戴って言えば、きっといい感じの関数を書いてくれそうですが、やっぱり表示する部分はUIデザイナーでも頑張ってみたいところです。

 

ではでは

今回はこの辺で