Android、Java、Web系、Linux、マラソン等の備忘録

2015/02/28

Androidのマテリアルデザインのサンプルを試したメモ1

0 件のコメント

こちらの記事を参考に試してみました。

導入に関してはこちらを参考に

環境

  • targetSdkVersion:21
  • 実行環境:androVM_vbox86p_4.1.1_r6.1-20130222-gapps-houndini-flash_1
  • IDE:Eclipse 4.3.2
  • AppCompat v7:リビジョン番号不明 → 21.0.3

影の描写

ImageViewに以下を記述してみましたが、
<ImageView …
    android:elevation="8dp" />

影表示されず....

こちらによれば、
Api level:20 以下では、たとえ android.support.v4.view.ViewCompat#setElevation(View, float) を呼び出しても 何も起こりません。 ViewCompat クラスをご覧頂ければわかりますが、setElevation(View, float) が実装されていないからです…
9-patch 画像や、 hoge.xml を drawable フォルダにぶち込むなど、従来の方法であれば実現可能です。
サポートライブラリでもダメという事ですね...というわけで一応確認のため、API Level 21で試してみましたが、表示されず...........。検索すると

わかった事は
  • 背景のxmlが必要
  • 背景色に透明度を含めてはダメ
ということで、
layout.xmlが
    <ImageView
        android:id="@+id/imageView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:elevation="18dp"
        android:padding="5dp"
        android:background="@drawable/myrect"
        android:src="@drawable/ic_launcher" />

myrect.xmlは、
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
       android:shape="rectangle">
    <solid android:color="#0073ff" />
    <corners android:radius="25dp" />
</shape>
結果
画像では分かり辛いですが、影を表示できてます。

カード

記事中にあるCardViewをレイアウトのxmlファイルに記述

<android.support.v7.widget.CardView
   android:layout_width="match_parent"
   android:layout_height="wrap_content">
   <!--カードのコンテンツ -->
</android.support.v7.widget.CardView>

この中にテキストビューを追加して、実行したところExceptionが発生しました。

02-27 14:45:29.078: E/AndroidRuntime(3003): Caused by: java.lang.ClassNotFoundException: android.support.v7.widget.CardView
ググると、こちらのベストアンサーになっている手順で、CardViewのライブラリを入れると表示できました。


カラー

「colorPrimary」がどうとか記述されてますが、どういう事かわからなかったので検索
こちらで、
<style name="Theme.MyTheme" parent="Theme.AppCompat.Light">
    <!-- AppCompat の color theming attrs を設定 -->
    <item name=”colorPrimary”>@color/myawesomered</item>
    <!-- 他の属性 -->
</style>
こう書けばいいみたいにあったので、やってみたらエラーが出ました。
No resource found that matches the given name: attr 'colorPrimary'.

なんでこう一筋縄に行かないのでしょうか。Android Studioを使わないからだと言われそうですが...

※Android Studioは昨年12月にVersion 1.0になって、Android SDKに依存しないモデル部分のテストがやり方がイマイチわからなず(または実行が遅い)など、その他Gradleよくわからない等で、作るのはEclipseの方が早いためまだ移行できてません。というか、マテリアルデザインで躓いてる時点でEclipseの方が遅いだろという話なのかもしれませんが。

AppCompat v7のリビジョン番号

AppCompat v7にもバージョンがあって、というかリビジョン番号と言うのが正しいかもしれませんが、古いやつを使っていたがために、colorPrimaryがエラーになっているようでした。

※ただ、リビジョン番号はEclipse上のAndroidプロジェクト単体ではよくわからず(ファイルやJarファイルの中とか見ましたがリビジョン番号の記述見つからず)、昨年(2014年)のたぶん6月頃だと思うのですが、Eclipse上で新しいAndroidプロジェクトを作成すると、AppCompatのプロジェクトが勝手に作成されて、エラーを吐くみたいな事があったと思いますがその時のAppCompatv7を使ってたためにcolorPrimaryを認識してくれなかったようです。
こちらにあるように↓
SDK_HOME配下の/extras/android/support/v7/appcompatのプロジェクトをインポートしてプロジェクトのPropertiesからAndroidをえらびLibraryにインポートしたSuppor Libraryのプロジェクトを追加します 
というのを使うべきで、Android SDK ManagerでSupport Libraryを最新にしていれば最新のが利用できるはずです。
 
上記の適用でリビジョン番号がわかります。

colorPrimaryを変更してみる

例えば、テーマがTheme.AppCompat.Light.DarkActionBarの場合、デフォルトのアクションバーの色は黒です。
テーマに以下のように記述すると、
    <style name="AppBaseTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <item name="colorPrimary">#3F51B5</item>
    </style>
アクションバーの色が変ります。
その他、colorAccentやcolorPrimaryDarkが指定できるようです。色に関してはこちらのカラーパレットを参考に。


500がprimary colorだそうですが、他の数字はよくわかりません。
追記:2015/03/01
色の話はここに少しあります。


感想

マテリアルデザインはサンプルを試すだけでも躓きポイントが多くて疲れました。とりあえずここまでで、他のはまた今度試してみます。

0 件のコメント :

コメントを投稿