AndroidカスタムTitleViewタイトル開発例


Androidの開発過程で、同じパターンを定義するプロジェクトのタイトルバーを繰り返し出会うことがよくあります。Androidは相次いでactionBar、toolBarを出しました。有用な友達も思い通りにならないことがあると信じています。例えば、タイトルバーが真ん中にある時、カスタムxmlファイルをtoolBarに渡す必要があります。ここでは、カスタムtitleBarが国内のテーマスタイルを満たす場合を紹介します。
効果を前もって見るために、先に効果図を書きます。

前期の準備
1.タイトル欄のtitleViewのためにIDを事前定義し、valuesの下のids.xmlの中で

<?xml version="1.0" encoding="utf-8"?>
<resources>
<item name="tv_title_name" type="id"/>
<item name="tv_left_text" type="id"/>
<item name="iv_left_image" type="id"/>
<item name="iv_right_image" type="id"/>
<item name="iv_right_image_two" type="id"/>
<item name="tv_right_text" type="id"/>
<item name="tv_right_text_two" type="id"/>
</resources>
ここでは左側戻りボタンID、タイトルID、後側ボタンidを定義し、左側は2つの場合が見られます。ImageView/TextView、右側は同時に2つのボタンがあり、写真ボタン、文字ボタンの組み合わせがあります。
2.カスタムタイトルバーの属性は、valuseの下のatr.xmlにあります。

<?xml version="1.0" encoding="utf-8"?>
<resources>
<!--      -->
<declare-styleable name="TitleAttr">
<attr name="title_name" format="reference|string"/>
<attr name="title_text_color" format="reference|color"/>
<attr name="title_drawable_right" format="reference"/>
<attr name="title_drawable_left" format="reference"/>
<attr name="title_text_size" format="reference|dimension"/>
<attr name="left_text" format="reference|string"/>
<attr name="left_image" format="reference"/>
<attr name="small_text_size" format="reference|dimension"/>
<attr name="title_gravity">
<enum name="left" value="3"/>
<enum name="center" value="17"/>
<enum name="right" value="5"/>
</attr>
<attr name="right_image" format="reference"/>
<attr name="right_text" format="reference|string"/>
<attr name="right_image_two" format="reference"/>
<attr name="right_text_two" format="reference|string"/>
<attr name="title_height" format="dimension"/>
<attr name="right_text_drawable_right" format="reference"/>
<attr name="right_text_drawable_left" format="reference"/>
<attr name="right_text_two_drawable_right" format="reference"/>
<attr name="right_text_two_drawable_left" format="reference"/>
<attr name="left_text_drawable_right" format="reference"/>
<attr name="left_text_drawable_left" format="reference"/>
</declare-styleable>
</resources>
•符号化実現
•前の準備ができたら、今からコード化が可能になります。ここでまず、xmlに私達のカスタマイズしたコントロールをどのように導入するかを見てみます。

<com.jarek.library.TitleView
android:id="@+id/title_main"
android:layout_width="match_parent"
android:background="#0093fe"
title:title_name="  "
title:right_text="@string/more"
title:title_text_color="@android:color/white"
title:right_image_two="@mipmap/icon_crop_rotate"
title:title_text_size="20sp"
title:small_text_size="15sp"
title:left_text="  "
title:left_text_drawable_left="@mipmap/back_normal"
title:right_text_drawable_right="@mipmap/bar_button_right"
android:layout_height="50dp"/>
ここのtitleラベルは私達がカスタマイズして、まず1つのクラスを創立してRelativeLayoutから継承して、ここはRelativeLayoutを父の種類の容器として選んで、目的はRelativeLayoutが相対的な位置を制御しやすいことにあります。
まずTypedArayオブジェクトを取得します。すべてのカスタム属性の値はこれによって取得されます。

TypedArray typeArray = context.obtainStyledAttributes(attrs, R.styleable.TitleAttr); 
typedArayオブジェクトを入手したら、容器にボタンを追加することができます。まず左の最初の戻りボタンを見てください。追加したら、コードを見てください。

int leftText = typeArray.getResourceId(R.styleable.TitleAttr_left_text, 0);
CharSequence charSequence = leftText > 0 ? typeArray.getResources().getText(leftText) : typeArray.getString(R.styleable.TitleAttr_left_text);
ここのlefttextはカスタム属性であり、左のTextViewに表示された文字であり、文字はアプリケーションリソースファイルのプリ定義stringであっても良いし、直接文字を入力して対応するstyleを取ったら、まず0より大きいかどうかを判断し、0より大きいかを判断します。stringに定義されています。typeAray.getResource().getText()を通じて、値を取得します。は、直接に値を割り当てることによって値を与えることができることを示します。値を取ったらどうやってTextViewに値を与えますか?ここではまず彼に幅を上げる必要があります。これはすべてのコントロールが必要です。

/**
* layout params of RelativeLayout
* @return LayoutParams
*/
private LayoutParams initLayoutParams () {
return new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.MATCH_PARENT);
} 
私たちは単独で方法を書きます。後は直接に通します。

LayoutParams params = initLayoutParams(); 
プリセットの幅と高値を取得します。ここでは、親コントロールの高さが適応されています。そしてnew一つのTextViewです。

/**
* create TextView
* @param context Context
* @param id the id of TextView
* @param charSequence text to show
* @param params relative params
* @return the TextView which is inited
*/
@NonNull
private TextView createTextView(Context context, int id, CharSequence charSequence, LayoutParams params) {
TextView textView = new TextView(context);
textView.setLayoutParams(params);
textView.setGravity(Gravity.CENTER);
textView.setId(id);
textView.setMinWidth((int)getPixelSizeByDp(minViewWidth));
textView.setText(charSequence);
return textView;
} 
ここでは、予め設定されたID値が入ってきて、表示すべき内容と、上記で与えられたLayoutParaamsを見ることができます。TextViewを作成したらTextViewのDrawableも設定できます。カスタム属性のleft_を通じて。text_.drawableライト、left_text_.drawableleftの設定は、ここで左右に設定されています。上下に対応する設定ができます。

/**
* drawable of TextView
* @param typeArray TypedArray
* @param leftDrawableStyleable leftDrawableStyleable
* @param rightDrawableStyleable rightDrawableStyleable
* @param textView which TextView to set
*/
private void setTextViewDrawable(TypedArray typeArray, int leftDrawableStyleable, int rightDrawableStyleable, TextView textView) {
int leftDrawable = typeArray.getResourceId(leftDrawableStyleable, 0);
int rightDrawable = typeArray.getResourceId(rightDrawableStyleable, 0);
textView.setCompoundDrawablePadding((int)getPixelSizeByDp(drawablePadding));
textView.setCompoundDrawablesWithIntrinsicBounds(leftDrawable, 0, rightDrawable, 0);
} 
ここでも一つの方法を抽出して通過します。

setTextViewDrawable(typeArray, R.styleable.TitleAttr_left_text_drawable_left, R.styleable.TitleAttr_left_text_drawable_right, mLeftBackTextTv); 
指定されたTextViewにdrawableをセットすることができます。TextViewを作成した後、私達が使っているのは相対配置で、位置ルールを指定する必要があります。

params.addRule(RelativeLayout.ALIGN_PARENT_LEFT); 
ここを左に表示します。フォントサイズも設定できます。カスタム属性:small_text_.size(両側の文字の大きさ)、title_text_.size(タイトルのテキストサイズ)でフォントを設定します。

/**
* get the dimension pixel size from typeArray which is defined in attr
* @param typeArray TypedArray
* @param stylable stylable
* @param defaultSize defaultSize
* @return the dimension pixel size
*/
private float getDimensionPixelSize(TypedArray typeArray, int stylable, int defaultSize) {
int sizeStyleable = typeArray.getResourceId(stylable, 0);
return sizeStyleable > 0 ? typeArray.getResources().getDimensionPixelSize(sizeStyleable) : typeArray.getDimensionPixelSize(stylable, (int)getPiselSizeBySp(defaultSize));
} 
同様に、ここも単独で一つの方法を書いて作っています。TypedArayの使い方は多く話しません。他の文章を見て知ることができます。次のようにフォントサイズを設定します。

float textSize = getDimensionPixelSize(typeArray, R.styleable.TitleAttr_small_text_size, defaultSmallTextSize);
mLeftBackTextTv.setTextSize(TypedValue.COMPLEX_UNIT_PX, textSize); 
文字の色、同じ意味:

/**
* get textColor
* @param typeArray TypedArray
* @return textColor
*/
private int getTextColorFromAttr (TypedArray typeArray) {
int textColorStyleable = typeArray.getResourceId(R.styleable.TitleAttr_title_text_color, 0);
if (textColorStyleable > 0) {
return typeArray.getResources().getColor(textColorStyleable);
} else {
return typeArray.getColor(R.styleable.TitleAttr_title_text_color, textColor);
}
} 
次にメソッドを呼び出して色を設定します。

mLeftBackTextTv.setTextColor(getTextColorFromAttr(typeArray)); 
ここまでは左側の最初の文字ボタンです。写真付きの文字ボタンで作成します。あと一歩です。

mLeftBackTextTv.setTextColor(getTextColorFromAttr(typeArray)); 
他のボタンも同じです。容器に順次追加してもいいです。これまで必要だったtitleViewは作成されました。後で使うと直接に呼び出すことができます。場所ごとに繰り返されるcodingは必要ありません。
プロジェクト住所:githubソースのダウンロード
以上は小编が绍介したAndroidカスタムTitleViewのタイトル开発の実例です。皆さんに何かご迷惑があったら、メッセージをください。小编はすぐに返事します。ここでも私たちのサイトを応援してくれてありがとうございます。