ゆとりブログ

[Android] androidのデザインなんちゃら

ども。こすげっす!!

ついに始まりましたね!!!
いやーやっぱ面白いっす!!
確かに残念だったけども、面白かった!

え?なにがって??

コンフェデレーションズカップに決まってるじゃん!

ブラジル強すぎ。てかみんなウマすぎ。
トラップしかり、パスしかり。
日本とはそこの差が一番だったんじゃないですかねー。

まあ2日連続でサッカーネタ書くとサッカーバカみたいに思われちゃうので、
今回は今やってる

Androidアプリ

のお話。
※アンドロイドってなんとなくなんだけど、赤のイメージないっすか??
ちなみにiOSはシルバー的な...。俺だけ??



えー現在androidアプリを作成してます。
ちなみにUIとかもやってます。

こういうの気になり始めたら私止まらない性格でして...。
なれないデザインに手をつけはじめてます。

まあxmlでやるのにもだいぶ慣れまして、eclipseさんともだいぶお近づきになれたかなと...。

UIに関してはこちらのサイトを参考にしてます!!!

Android Application Design Acheve
http://dorodoro.info/aada/
アプリのUI集ですね。

こういうの眺めてるだけで幸せになれます...。
できればこういう書き方するんだよ的なアレも欲しかったですが、そこは我慢。。。

でですよ。
前に作ったサービスのアプリを開発しているのですが、デザインはサービスに準じたほうが
ユーザーも使いやすいと思うんですよねー。


で、一番色がでるのが、ボタンなのかなと。
あとはテキストね。


ってことで、デザイナーさんに主要の色を教わり、自分で作成しました!
カラーの参考にしたサイトは以下!!

Color Scheme Designer 3
http://colorschemedesigner.com/


ここに特定の色のカラーコードを入力すると
近しい色を教えてくれます!!

そうとう助かりました!
これやべーっすよ!



てな感じで最後にandroidのボタンのデザインの仕方でも...
※androidなんで赤系でねww


まずは res/values/直下に例にならってstyle.xmlを作成します!
そして下記コードを...


<style name="button_red" parent="@android:style/Widget.Button">
<item name="android:background">@drawable/button_red_style</item>
</style>

ここの

<item name="android:background">@drawable/button_red_style</item>


の部分に注目してください。

これなんぞやってまさに
res/drawable/button_red_style.xmlを指してます!
なんでそのファイルを作成してください!


# res/drawable/button_red_style.xml
<!--?xml version="1.0" encoding="utf-8"?-->
<selector xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:drawable="@drawable/button_red_default" android:state_enabled="true" android:state_window_focused="false"></item>
  <item android:drawable="@drawable/button_red_enabled" android:state_enabled="false" android:state_window_focused="false"></item>
  <item android:drawable="@drawable/button_red_enabled" android:state_enabled="false"></item>
  <item android:drawable="@drawable/button_red_pressed" android:state_pressed="true"></item>
  <item android:drawable="@drawable/button_red_pressed" android:state_enabled="true" android:state_focused="true"></item>
  <item android:drawable="@drawable/button_red_default" android:state_enabled="true"></item>
  <item android:drawable="@drawable/button_red_focused" android:state_focused="true"></item>
  <item android:drawable="@drawable/button_red_default"></item>
</selector>

という感じです。

" android:state_* "ってやつが謎だと思いますが、調べてください。
大体読めばわかるはず!!

で、さらにココに出てくる
button_red_enabled やら button_red_pressed やら button_red_focused やら button_red_default がありますね。
勘のいい人はわかるかもですがこれも
res/drawable直下にxmlファイルを作ります!

一気に書いちゃいますね!

# res/drawable/button_red_default.xml
<!--?xml version="1.0" encoding="utf-8"?-->
<shape xmlns:android="http://schemas.android.com/apk/res/android">

<padding
android:bottom="10dp"
android:left="10dp"
android:right="10dp"
android:top="10dp" />

<corners android:radius="0dp"></corners>

<gradient
android:angle="270"
android:startColor="#E51600"
android:endColor="#950E00"
android:type="linear" />

<stroke
android:width="1dp"
android:color="#950E00" />

</shape>


# res/drawable/button_red_enabled.xml
<!--?xml version="1.0" encoding="utf-8"?-->
<shape xmlns:android="http://schemas.android.com/apk/res/android">

<padding
android:bottom="10dp"
android:left="10dp"
android:right="10dp"
android:top="10dp" />

<corners android:radius="0dp"></corners>

<gradient
android:angle="270"
android:startColor="#610900"
android:endColor="#3F0600"
android:type="linear" />

<stroke
android:width="1dp"
android:color="#3F0600" />

</shape>


#res/drawable/button_red_focused.xml
<!--?xml version="1.0" encoding="utf-8"?-->
<shape xmlns:android="http://schemas.android.com/apk/res/android">

<padding
android:bottom="10dp"
android:left="10dp"
android:right="10dp"
android:top="10dp" />

<corners android:radius="0dp"></corners>

<gradient
android:angle="270"
android:startColor="#F24E3D"
android:endColor="#F27A6D"
android:type="linear" />

<stroke
android:width="1dp"
android:color="#950E00" />
</shape>


# res/drawable/button_red_pressed.xml
<!--?xml version="1.0" encoding="utf-8"?-->
<shape xmlns:android="http://schemas.android.com/apk/res/android">

<padding
android:bottom="10dp"
android:left="10dp"
android:right="10dp"
android:top="10dp" />

<corners android:radius="0dp"></corners>

<gradient
android:angle="270"
android:startColor="#F24E3D"
android:endColor="#F27A6D"
android:type="linear" />

<stroke
android:width="1dp"
android:color="#950E00" />

</shape>


という感じです。
ファイル作成なら下から
(つまりbutton_red_*.xmlファイルから作成していったほうがeclipseさんも怒らず幸せに過ごせるかも...)

でこれをlayoutにてButtonのsytleに適用すればおk


<button
style="@style/button_blue"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />


完成はこんな感じです!

※ button_red_default


※ button_red_enabled


※ button_red_pressed と button_red_focusedはうまくとれなかったので、うまくやってください...。

そんな感じで頑張ってまーす!
ではまた!!

【ゆとり】除湿器について考える

みなもとです。



季節も梅雨に入ってすっかりジメってますねっ!



低気圧と湿気に弱いことに定評のあるボクですから、

完全に参ってしまいます(*;x;)



とゆーワケで除湿器買おうとおもうよ!!


続きを読む

【Football】この前のW杯最終予選とかCL決勝とかとか

どもーこすげっすー。
最近、1週間がとてつもなく早く感じられます。はい。
日々が充実しているのか、それともただ時の流れを早く感じてしまっているのか...。

そんなことぁどーでもよし!!!

先週はW杯最終予選がありましたねー。

我らが本田△が決めてくれました。

同じ金髪としてばんばんざいです。




本田△が活躍していただけるおかげで金髪は正義になりつつあるでしょう。
社会人になってまで金髪にしてるとか...。ww



もともと自分黄色が好きなんです。

今まで黄色いユニなどは纏ったことないんですが、自然と応援していしまうチームのユニフォームは黄色なチームが多いっす。



とここで気がつく人はさすがっす!!!

そう、(だいぶ時間たってしまいましたが)CL決勝!!

バイエルン vs ドルトムント(ウェンブリー)ですたね。

この試合は正直何回見ても飽きない。

ドルトムントの攻撃を一人で防ぐノイヤー。
リベリーとロッベンをマンツーマンで防ぐドルトムントのサイドバック。
あつすぎましたね。


ただ、ロッベンとリベリー。
あんたらは別格だ。




ドルトムントにはロイスがいますが、やっぱ組織の中というか、味方が犠牲になって活躍出来る選手なんですよね。
(犠牲っていうのは、身体張るとかじゃなくて、裏に抜けてくれるとか近くによってきてくれるとか、デコイの動きとか。)
リベリーとロッベンが持った時のドキドキ感とかさ。
二人が同じサイドに寄った時のなにか起きる感とかさ。(後半それで点決めちったし)

この二人の足元にパスを送るシュバインシュタイガーとハビ・マルティネスは素晴らしかったっす。



ドルトムントのプレスからのショートカウンターも熱かったですよ!
あの戦術を代表レベルでできたらW杯も優勝できるでしょうね。(スペインがそうでしたのー)


では日本代表に話を戻しまして...。

今ボールを持った時にドキドキする選手は誰なんだ。って話よねww

全部自分の主観なんで、全然気にしないでもらって大丈夫っすよ。


まー本田△なわけですよ。
でさらに本田△と香川とが近くよって、逆サイドにざきおかさんがいるときね!
点入るっしょ的な感じがしなくもないのかなー。ってww


うん。


ぜひともコンフェデ頑張って欲しいっす。
W杯最終予選も残り2試合、勝っていただきたいです!

今日日本代表選だからお先しつれいしゃっす!!!
的な感じで帰りたいものだ。



ってことで、ばいちゃ。