【Android】Android標準レイアウトを変更してみる【レイアウト】

【ここの部分は読み飛ばしても大丈夫です】

お仕事でTabView使っていたのです。

TabViewって標準でテキストにアニメーションが入ってて、長すぎるテキスト
入れると、文字が小さくならずに、選択時にアニメーションで隠れた文字が
出てくるようになるんですよね。
その為、標準のプロパティの中にはテキストサイズ(Textsize)の変更が存在
していません。

そんな中で言われたのが・・・

お客様「アニメーション要らないからテキストサイズ小さくして」
私「(； ﾟдﾟ)・・・はい。。。」

まぁ、Viewのxml手打ちすれば良いかとか思っていたのですが、現在のレイ
アウトに特に不満を持っているわけでも無さそうだったので、できる限りレイ
アウト弄りたくない！（メンドウだし）。。。
そう思って調べたらありました！



【やっと本題】
さて、今回はTabViewを例として挙げていますが、結構色んなレイアウト変更
することが出来るみたいです。

※それと、これ書きながらテストコード打っていたのですが、自宅のSDKのバー
ジョンが古いようで、会社の時とは挙動が違いました。今回の画像ではタブの
イメージとタブの文字が被ってしまっていますが、最新のSDKでは自動でイメー
ジのサイズが調整されたはずです。余裕あったら後で直します。。。

まずは普通に実装します。

TabTestActivity.java

import android.app.Activity;
import android.app.TabActivity;
import android.content.res.Resources;
import android.os.Bundle;
import android.widget.TabHost;

//継承はTabActivityなのをお忘れなく
public class TabTestActivity extends TabActivity{
 /** Called when the activity is first created. */
 @Override
 public void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.main);

  //リソースフォルダ
  Resources res = getResources();

  //タブの本体作成
  TabHost tabHost = getTabHost();

  //多分タブ夫々の本体？
  TabHost.TabSpec spec;

  //Tab夫々を作っていきます。今回は３つ////////////////////

  //1個目
  spec = tabHost.newTabSpec("tab1")
    .setIndicator("Tab1test",
      res.getDrawable(R.drawable.ic_launcher))
      .setContent(R.id.Tab1);
  tabHost.addTab(spec);

  //2個目
  spec = tabHost.newTabSpec("tab2")
    .setIndicator("tab2test",
      res.getDrawable(R.drawable.ic_launcher))
      .setContent(R.id.Tab2);
  tabHost.addTab(spec);

  //3個目
  spec = tabHost.newTabSpec("tab3")
    .setIndicator("tab3testてすとてすと",
      res.getDrawable(R.drawable.ic_launcher))
      .setContent(R.id.Tab3);
  tabHost.addTab(spec);

  //Tabが呼び出された時、どこを起動画面にするか選択(0からだよ)
  tabHost.setCurrentTab(0);

  //////////////////////////////////////////////////////


 }
}

main.xml

<?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/tabhost"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical" >

        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content" />

        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent" >

            <LinearLayout
                android:id="@+id/Tab1"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent" >

                <TextView
                    android:layout_width="fill_parent"
                    android:layout_height="fill_parent"
                    android:text="Tab1の表示" />
            </LinearLayout>

            <LinearLayout
                android:id="@+id/Tab2"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent" >

                <TextView
                    android:layout_width="fill_parent"
                    android:layout_height="fill_parent"
                    android:text="Tab2の表示" />
            </LinearLayout>

            <LinearLayout
                android:id="@+id/Tab3"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent" >

                <TextView
                    android:layout_width="fill_parent"
                    android:layout_height="fill_parent"
                    android:text="Tab3の表示" />
            </LinearLayout>
        </FrameLayout>
    </LinearLayout>

</TabHost>

実装画面

※イメージとテキストの重なりは最新のSDKなら自動で修正してくれるはずです。

 さて、この時のTab3の文字が微妙に枠からはみ出しているのが確認頂けますでしょうか？
 これの修正やっていきます。
 残念ながらTabWidgetのプロパティにはテキストサイズの項目が無いようで、
android:textsize ="10sp"なんてのができません。 そこで、Android標準のレイアウトを変更
する事にします。




まず、style.xml作ります。

中身はこんな感じ

style.xml

<?xml version="1.0" encoding="utf-8"?>

<resources>

    <style name="MyTheme" parent="android:Theme">
        <item name="android:textViewStyle">@style/MyTextView</item>
    </style>

    <style name="MyTextView" parent="android:Widget.TextView">
        <item name="android:textSize">10sp</item>
    </style>

</resources>

この"Theme"ってのを使うと、アプリ内の特定の標準レイアウトだけを変更
できるらしいです。
今回はTabのtextSizeを"10sp"に変更してみます。


styleが書けたので、これをAndroidManifest.xmlに読み込ませます。


AndroidManifest.xml

<?xml version="1.0" encoding="utf-8"?>

<manifest xmlns:android="http://schemas.android.com/apk/res/android"

    package="com.kumagai.shift"

    android:versionCode="1"

    android:versionName="1.0" >



    <uses-sdk android:minSdkVersion="7" />



    <application

        android:icon="@drawable/ic_launcher"

        android:label="@string/app_name" >

        <activity

            android:name=".TabTestActivity"

            android:label="@string/app_name"

            android:theme="@style/MyTheme">

            <intent-filter>

                <action android:name="android.intent.action.MAIN" />



                <category android:name="android.intent.category.LAUNCHER" />

            </intent-filter>

        </activity>

    </application>



</manifest>

<activity>の部分にandroid:theme="@style/MyTheme"を追加しました。



これで起動すると・・・

この様になります。

Tabの文字が小さくなっているのが確認できますでしょうか？

Tab3の文字が見きれていたのが改善されました。

Activity全体に適応されるので下のLinerLayoutのTextViewでも文字が小さく

なってしまっていますが、こちらは個別に変更可能なため、適当に

<TextView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="Tab2の表示"
android:textSize="100sp" />

とでもやれば・・・



















でかくなります（笑


Themeで変更可能なものが結構御座います。
どこかに一覧みたいなのあったはずだけど、どこで見つけたか忘れてしまった。。。


参考サイト
  Y.A.M の 雑記帳　詰まった所があり探すと、必ずといって良い程解決策が載ってるサイト様
  Tech Booster　ここもよく行き着きますねｗ





Androidのデザイン関連ですと、この辺りの書籍は目を通しておくと良いかも。。。