fc2ブログ
ヽ|∵|ゝ(Fantom) の 開発blog? ホーム »プログラミング
カテゴリー「プログラミング」の記事一覧

HTMLカラー名・カラーコード表  


HTMLカラー名・カラーコード表

カラー名名前タグコードタグカラーコード
White #ffffff
Snow #fffafa
GhostWhite #f8f8ff
WhiteSmoke #f5f5f5
FloralWhite #fffaf0
Linen #faf0e6
AntiqueWhite #faebd7
PapayaWhip #ffefd5
BlanchedAlmond #ffebcd
Bisque #ffe4c4
Moccasin #ffe4b5
NavajoWhite #ffdead
PeachPuff #ffdab9
MistyRose #ffe4e1
LavenderBlush #fff0f5
Seashell #fff5ee
OldLace #fdf5e6
Ivory #fffff0
Honeydew #f0fff0
MintCream #f5fffa
Azure #f0ffff
AliceBlue #f0f8ff
Lavender #e6e6fa
Black #000000
DarkSlateGray #2f4f4f
DarkSlateGrey #2f4f4f
DimGray #696969
DimGrey #696969
Gray #808080
Grey #808080
DarkGray #a9a9a9
DarkGrey #a9a9a9
Silver #c0c0c0
LightGray #d3d3d3
LightGrey #d3d3d3
Gainsboro #dcdcdc
LightSlateGray #778899
LightSlateGrey #778899
SlateGray #708090
SlateGrey #708090
LightSteelBlue #b0c4de
SteelBlue #4682b4
RoyalBlue #4169e1
MidnightBlue #191970
Navy #000080
DarkBlue #00008b
MediumBlue #0000cd
Blue #0000ff
DodgerBlue #1e90ff
CornflowerBlue #6495ed
DeepSkyBlue #00bfff
LightSkyBlue #87cefa
SkyBlue #87ceeb
LightBlue #add8e6
PowderBlue #b0e0e6
PaleTurquoise #afeeee
LightCyan #e0ffff
Cyan #00ffff
Aqua #00ffff
Turquoise #40e0d0
MediumTurquoise #48d1cc
DarkTurquoise #00ced1
LightSeaGreen #20b2aa
CadetBlue #5f9ea0
DarkCyan #008b8b
Teal #008080
SeaGreen #2e8b57
DarkOliveGreen #556b2f
DarkGreen #006400
Green #008000
ForestGreen #228b22
MediumSeaGreen #3cb371
DarkSeaGreen #8fbc8f
MediumAquamarine #66cdaa
Aquamarine #7fffd4
PaleGreen #98fb98
LightGreen #90ee90
SpringGreen #00ff7f
MediumSpringGreen #00fa9a
LawnGreen #7cfc00
Chartreuse #7fff00
GreenYellow #adff2f
Lime #00ff00
LimeGreen #32cd32
YellowGreen #9acd32
OliveDrab #6b8e23
Olive #808000
DarkKhaki #bdb76b
PaleGoldenrod #eee8aa
Cornsilk #fff8dc
Beige #f5f5dc
LightYellow #ffffe0
LightGoldenrodYellow #fafad2
LemonChiffon #fffacd
Wheat #f5deb3
Burlywood #deb887
Tan #d2b48c
Khaki #f0e68c
Yellow #ffff00
Gold #ffd700
Orange #ffa500
SandyBrown #f4a460
DarkOrange #ff8c00
Goldenrod #daa520
Peru #cd853f
DarkGoldenrod #b8860b
Chocolate #d2691e
Sienna #a0522d
SaddleBrown #8b4513
Maroon #800000
DarkRed #8b0000
Brown #a52a2a
Firebrick #b22222
IndianRed #cd5c5c
RosyBrown #bc8f8f
DarkSalmon #e9967a
LightCoral #f08080
Salmon #fa8072
LightSalmon #ffa07a
Coral #ff7f50
Tomato #ff6347
OrangeRed #ff4500
Red #ff0000
Crimson #dc143c
MediumVioletRed #c71585
DeepPink #ff1493
HotPink #ff69b4
PaleVioletRed #db7093
Pink #ffc0cb
LightPink #ffb6c1
Thistle #d8bfd8
Magenta #ff00ff
Fuchsia #ff00ff
Violet #ee82ee
Plum #dda0dd
Orchid #da70d6
MediumOrchid #ba55d3
DarkOrchid #9932cc
DarkViolet #9400d3
DarkMagenta #8b008b
Purple #800080
Indigo #4b0082
DarkSlateBlue #483d8b
BlueViolet #8a2be2
MediumPurple #9370db
SlateBlue #6a5acd
MediumSlateBlue #7b68ee


■色の表示について

「名前タグ」(左側)はカラー名で指定した場合の色、
(例) bgcolor="White"
「コードタグ」(右側)はカラーコードで指定した場合の色、
(例) bgcolor="#ffffff"
になります。

ブラウザが対応していればどちらも同じ色に表示されます。

■グレーの表記について

「Gray」と「Grey」どちらも同じものとして表記してあります。

■異名同色について

「Aqua」=「Cyan」
「Fuchsia」=「Magenta」
の2組です。カラーコードは同じになります。






(関連記事)
【Unity】色形式:Unity の Color と Android の ARGB(int32) の相互変換をする


スポンサーサイト



category: プログラミング

thread: ソフトウェア開発

janre: コンピュータ

tag: HTMLリファレンス  グラフィックス 
tb: 0   cm: --

【一覧】Java, C#, PHP, Ruby, Python, JavaScript での Math.round(四捨五入・五捨六入)比較  


 先日、言語間で算術関数を含む移植などしてたら、結果が違ってたので改めて調べてみた。「負の値の割り算や剰余」なんかもそうだけど、言語仕様によって値が違ってたりするので、毎回確認するのは面倒なんだよね。せっかくなので、一覧にしていつでも見れるようにしておこうと考えた。


(元の値)
JavaJavaScriptC#Python3RubyPHP
Math.roundMath.roundMath.Roundroundroundround
-2.0-2-2-2-2-2-2
-1.6-2-2-2-2-2-2
-1.5-1-1-2-2-2-2
-1.4-1-1-1-1-1-1
-1.0-1-1-1-1-1-1
-0.6-1-1-1-1-1-1
-0.5 0 0 0 0-1-1
-0.4 0 0 0 0 0 0
0.0 0 0 0 0 0 0
0.4 0 0 0 0 0 0
0.5 1 1 0 0 1 1
0.6 1 1 1 1 1 1
1.0 1 1 1 1 1 1
1.4 1 1 1 1 1 1
1.5 2 2 2 2 2 2
1.6 2 2 2 2 2 2
2.0 2 2 2 2 2 2


 実際の結果は以下の通り。paiza.io で比較した。

Java, C#, PHP でのRound結果
Java, C#, PHP
Ruby, Python, JavaScript でのRound結果
Ruby, Python, JavaScript
(クリックで拡大)

 言語によっては丸め方法のオプションなんかもあるが、そのまま使ってると四捨五入っぽかったり、五捨六入っぽかったり、0からの距離っぽかったり、値の境界が異なるので、複数の言語を使うときには気をつけた方が良いだろう。

 どうしても揃えたければ

 floor(v + 0.5)

のようにする手もある。

 また、「0からの距離でグループ分け」と「等間隔にグループ分け」で使い分けをすることもできるので、知っておいても損はないだろう。

「0からの距離でグループ分け」と「等間隔にグループ分け」
(クリックで拡大)


 まぁ、何にしても、「負の値の演算」「丸め誤差を持つ演算」「0をまたぐ演算」あたりは仕様を確認しておいた方が良いだろう。


(関連記事)
【C#】倍数での Floor, Ceil, Round(一定間隔での切り捨て、切り上げ、四捨五入) [double 版]
【Unity】倍数での Floor, Ceil, Round(一定間隔での切り捨て、切り上げ、四捨五入) [float 版]
【Java】Math.floor(), ceil(), round() 動作互換アルゴリズムを試す



category: プログラミング

thread: プログラミング

janre: コンピュータ

tag: Java  C#  PHP  Ruby  Python  JavaScript  一覧  算術関数 
tb: 0   cm: --

Android と Applet の互換ってできるもんだね  


 以前から考えていた Android と Applet の互換コーディングに成功。ほぼ想定通りだったかな。主に両プラットフォームに共通部分はインターフェイス(interface)と抽象クラス(abstract)で構成し、各プラットフォーム依存のオブジェクトは、それら共通オブジェクトをインプリメントした実装クラスをオブジェクトラッパーのように使うことにより、ほぼ同じコードで動かせるようになった。これならコピペで移植出来るね(笑)。


(左)Appletビューワ / (右)Androidエミュレータ

 見た目も細かく調整したので、ほとんど変わらない。内蔵フォントの違いなどはあるけどね。これらの実行部分はまったく同じコード。別コードで表記しなくてはならない箇所は、起動クラスとその構成を司る部分(Android では Activity と View、アプレットでは Applet)だけだね。一度それらを起動してしまえば、あとはすべてラッパークラスで十分だった。

 元々この Android と Applet の互換ライブラリは、頭にあった構想をただ作ってみただけだけど(特に意味はない。興味本位(笑))、完成してみたら、結構使えるかもね。というのは、Android のエミュレータって物凄く重いので、特にリアルタイム処理の確認には向かない。だから必ず実機で確認するしかないんだけど、このライブラリを使うとアプレットで動作を確認してから、Android 用にコンパイルしても動く。AppletViewer の動作は速いので、エミュレータ代わりに使える。これらサンプルはそうやって作ったもの。非常に開発が楽だ(笑)。

 実際に動いているものを見てみたい場合はこちら↓

[Rule Generator Demo]
Applet 版のサンプル(PC[IE]でアクセス)
Android 版のサンプル(Android2.2以降でアクセス)

 ちなみに Rule Generator というのは、トランジションルール画像の自動生成ツールを Java に移植したもの。このデモはそれをランダムに生成して、トランジション効果を試しているだけ(ゲームではない)。

 ただし、実行にはかなりメモリを食うので、スホマは Out of Memory で落ちることもあるかも。その辺の調整はまた考えるしかないね。

 ライブラリのコードは元の約3倍になってしまったが、体感的にはそれほど実行速度は落ちてないかな。リアルタイムな fps モニタ機能をつけてあるが、スマホの方が速いみたい。これからはこれで簡単なゲームでも作ってみるかな。


※キャラクター画像は「著作権フリー立ちキャラクター素材集」を使用しています。

著作権フリーキャラクター素材集


(関連記事)
【Android】【Applet】【Java】interface と abstract の使い方・違いとは~簡単なフレームワークを作って、考えてみる
【Android】【Applet】【Java】interface を使って独自のラッパークラスを作る
【Android】【Applet】【Java】interface を使ってインスタンスを生成する

category: プログラミング

thread: プログラミング

janre: コンピュータ

tag: サンプル 
tb: 0   cm: --

トランジションルール画像の自動生成を移植  



Android版トランジションルール画像自動生成

 意外とアッサリ移植できてしまった(笑)。ライブラリとして作ったので、他のゲームにも使えそう。

 ただ、ペイントソフト(PhotoShopとか)などから比べると、モアレ(縞模様)が結構出るので、多少汚いね。でも画面効果として使う分には問題なさそう。それに、画像圧縮の仕様として、同じ色や近似色が並ぶような絵柄はファイルサイズ小さくなるので良いのだけれど、ノイズっぽいのとか、パターン性があまりない画像は圧縮が効かないので、動的に生成して、ファイルを使用しなくて良いのは、随分とファイルサイズを削減できる。


トランジションルール画像同士を合成

 また、ついでにトランジションルール画像同士を合成する機能も付けておいた。例えば、横線のルール画像と右から左へのグラデーション画像をミックスして、線の入ったグラデーションを生成する。すると移動シーンのエフェクトみたいなものが簡単に作れるわけだ。


使用例

 試しに使ってみたけど、少々グラデーションの粗さはあるが、演出としては全く問題ない。これなら組み合わせ次第で色々作れるし、バリエーションにも困らない。それでもってファイルサイズ0。うん、良い仕事をしてくれる(笑)。

 キャラや背景画像はなかなか減らせないからね。こういった工夫も良いかも。実はプログラムよりも画像や音素材の方が何百倍も大きいんだよね。1つ減らせるだけで、どれだけ助かるか・・・。

[Rule Generator Demo]
Applet 版のサンプル(PC[IE]でアクセス)
Android 版のサンプル(Android2.2以降でアクセス)

※シナリオ:月華夜奏さん
※キャラクター画像は「著作権フリー立ちキャラクター素材集」を使用しています。
※背景画像は「きまぐれアフター」と「ぐったりにゃんこ」のフリー素材を使用しています。

著作権フリーキャラクター素材集


(関連記事)
Android と Applet の互換ってできるもんだね

category: プログラミング

thread: ゲーム開発

janre: コンピュータ

tag: グラフィックス 
tb: 0   cm: --


プロフィール

Social

検索フォーム

全記事一覧

カテゴリ

ユーザータグ

最新記事

リンク

PR

▲ Pagetop