1. HOME
  2. ブログ
  3. 05 技術情報
  4. Android
  5. 【Android開発Vol.4】 ボタンの色を変えてみよう

BLOG

ブログ

Android

【Android開発Vol.4】 ボタンの色を変えてみよう

 
 
 
 

 

 
 
 
皆さんこんにちは。
営業部の松井です。
 
 
もうすっかり寒くなってきて、
外出するにもコートが必要な時期になりましたね。
毎年この時期になると、時が経つのは早いなぁと
しみじみ感じてしまいます。
 
 
さて、前回までは真っ新な画面に対して
ボタンを「どのように」配置するかというレイアウトについて
学んでいきました。
 
今回は、配置したボタンの色を変更するやり方について
お話いたします。
 
 
そもそも、何もせずにボタンを設置するとどのようになるのでしょうか?
下の画面は色の設定をせずにボタンを配置した様子です。
 
ご覧のように、ボタンは灰色で表示されます。
 
では実際にボタンの色を変えるにはどうしたら良いか、
これから紹介いたします。
 
 
今回は2つのやり方についてご紹介します。
まずは、ボタンを作成する際に色を設定するやり方です。
そのままですね。
 
もう一つのやり方は、
予め「スタイル」をいくつか決めておいて、
ボタンを作成する時に、どの「スタイル」を使うか
指定するというやり方です。
 
なぜこの様なやり方をするのか、
疑問に思われた方もいるかもしれません。
 
例えばボタンを複数作成する場合、
ボタンを作成する度に色の設定を行うのは
大変ですよね。
 
もしボタンを作成した後で色を変更したいなと思ったら
一個ずつボタンの色を変更していくことになります。
 
しかし、スタイルを決めておけば
後からボタンの色を変更したくなっても、
スタイルの部分だけ変更すればそれで済みます。
今後、色んなモノを作成していく上では
非常に役に立つ機能かと思います。
 
 
しかも、スタイルで設定できるのは
色だけではありません。
 
実はボタンはカタチを変更する事が出来るのです。
こうすることで、ボタンにもう少し丸みをつけよう
という事が出来るようになります。
 
 
それでは実際の設定方法を見ていきましょう。
まずは、ボタンの作成時に色を設定するやり方です。
 
通常通りボタンを作成する時に、
android:backgroundでボタンの色を変更できます。
尚、色はRGBで指定します。
RGBのサンプルについては下記のサイトが参考になります。
 
RGBサンプルサイト:http://www.colordic.org/
 
実際にタブレットには
この様に表示されました。
 
では次に、先ほど紹介した
スタイルを設定してボタンの色を変更するやり方について
見ていきたいと思います。
 
まずは元になるスタイルを作成します。
左の一覧からDrawableを選択して右クリック
newという項目のDrawable resource fileを選択します。
 
すると以下の画面が表示されますので、
名前を入力して作成します。
 
次に新たに作成されたファイル
(今回の場合は「style1」)
を開き、以下のように入力していきます。
 
同じように「style2」と「style3」を作成し
設定したい色と角の丸み具合を設定します。
 
これでスタイルは完了です。
 
それでは先ほどのボタンを作成した画面から
backgroundの部分にスタイルを指定していきます。
 
タブレットには以下のように
表示されました。
 
 
先ほど作成したボタンと比べてみると、
ボタンの角に丸みが出ているのが
お分かり頂けるでしょうか?
 
この様にスタイルを作成する事で、
複数のモノを画面に配置した時でも
統一感を出すことが出来ますね。
 
 
以上がボタンの色の変更方法になります。
画面にボタンを配置し、ボタンの色やカタチを
変更する事が出来るようになりました。
 
次回はボタンを押した時の
ページの遷移についてお話したいと思います。
いよいよプログラミング的な話になってきました。
次回もどうぞよろしくお願い致します。
 

関連記事