1.基礎屬性詳解:
通過下面這個簡單的界面,我們來了解幾個最基本的屬性:
布局代碼:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity"
android:gravity="center"
android:background="#8fffad">
<TextView
android:id="@+id/txtOne"
android:layout_width="200dp"
android:layout_height="200dp"
android:gravity="center"
android:text="TextView(顯示框)"
android:textColor="#EA5246"
android:textStyle="bold|italic"
android:background="#000000"
android:textSize="18sp" />
</RelativeLayout>
上面的TextView中有下述幾個屬性:
id:為TextView設置一個組件id,根據id,我們可以在Java代碼中通過findViewById()的方法獲取到該對象,然后進行相關屬性的設置,又或者使用RelativeLayout時,參考組件用的也是id!
layout_width:組件的寬度,一般寫:wrap_content或者match_parent(fill_parent),前者是控件顯示的內容多大,控件就多大,而后者會填滿該控件所在的父容器;當然也可以設置成特定的大小,比如我這里為了顯示效果,設置成了200dp。
layout_height:組件的寬度,內容同上。
gravity:設置控件中內容的對齊方向,TextView中是文字,ImageView中是圖片等等。
text:設置顯示的文本內容,一般我們是把字符串寫到string.xml文件中,然后通過@String/xxx取得對應的字符串內容的,這里為了方便我直接就寫到""里,不建議這樣寫?。。?/p>
textColor:設置字體顏色,同上,通過colors.xml資源來引用,別直接這樣寫!
textStyle:設置字體風格,三個可選值:normal(無效果),bold(加粗),italic(斜體)
textSize:字體大小,單位一般是用sp!
background:控件的背景顏色,可以理解為填充整個控件的顏色,可以是圖片哦!
2.實際開發例子
2.1 帶陰影的TextView
涉及到的幾個屬性:
android:shadowColor:設置陰影顏色,需要與shadowRadius一起使用哦!
android:shadowRadius:設置陰影的模糊程度,設為0.1就變成字體顏色了,建議使用3.0
android:shadowDx:設置陰影在水平方向的偏移,就是水平方向陰影開始的橫坐標位置
android:shadowDy:設置陰影在豎直方向的偏移,就是豎直方向陰影開始的縱坐標位置
效果圖:
實現代碼:
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:shadowColor="#F9F900"
android:shadowDx="10.0"
android:shadowDy="10.0"
android:shadowRadius="3.0"
android:text="帶陰影的TextView"
android:textColor="#4A4AFF"
android:textSize="30sp" />
2.2 帶邊框的TextView:
如果你想為TextView設置一個邊框背景,普通矩形邊框或者圓角邊框!下面可能幫到你! 另外TextView是很多其他控件的父類,比如Button,也可以設置這樣的邊框! 實現原理很簡單,自行編寫一個ShapeDrawable的資源文件!然后TextView將blackgroung 設置為這個drawable資源即可!
簡單說下shapeDrawable資源文件的幾個節點以及屬性:
<solid android:color = "xxx"> 這個是設置背景顏色的
<stroke android:width = "xdp" android:color="xxx"> 這個是設置邊框的粗細,以及邊框顏色的
<padding androidLbottom = "xdp"...> 這個是設置邊距的
<corners android:topLeftRadius="10px"...> 這個是設置圓角的
<gradient> 這個是設置漸變色的,可選屬性有: startColor:起始顏色 endColor:結束顏色 centerColor:中間顏色 angle:方向角度,等于0時,從左到右,然后逆時針方向轉,當angle = 90度時從下往上 type:設置漸變的類型
實現效果圖:
代碼實現:
Step 1:編寫矩形邊框的Drawable:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<!-- 設置一個黑色邊框 -->
<stroke android:width="2px" android:color="#000000"/>
<!-- 漸變 -->
<gradient
android:angle="270"
android:endColor="#C0C0C0"
android:startColor="#FCD209" />
<!-- 設置一下邊距,讓空間大一點 -->
<padding
android:left="5dp"
android:top="5dp"
android:right="5dp"
android:bottom="5dp"/>
</shape>
Step 2:編寫圓角矩形邊框的Drawable:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<!-- 設置藍色背景色 -->
<solid android:color="#87CEEB" />
<!-- 設置一個黑色邊框 -->
<stroke
android:width="2px"
android:color="#000000" />
<!-- 設置四個圓角的半徑 -->
<corners
android:bottomLeftRadius="10px"
android:bottomRightRadius="10px"
android:topLeftRadius="10px"
android:topRightRadius="10px" />
<!-- 設置一下邊距,讓空間大一點 -->
<padding
android:bottom="5dp"
android:left="5dp"
android:right="5dp"
android:top="5dp" />
</shape>
Step 3:將TextView的blackground屬性設置成上面這兩個Drawable:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FFFFFF"
android:gravity="center"
android:orientation="vertical"
tools:context=".MainActivity">
<TextView
android:id="@+id/txtOne"
android:layout_width="200dp"
android:layout_height="64dp"
android:textSize="18sp"
android:gravity="center"
android:background="@drawable/txt_rectborder"
android:text="矩形邊框的TextView" />
<TextView
android:id="@+id/txtTwo"
android:layout_width="200dp"
android:layout_height="64dp"
android:layout_marginTop="10dp"
android:textSize="18sp"
android:gravity="center"
android:background="@drawable/txt_radiuborder"
android:text="圓角邊框的TextView" />
</LinearLayout>
2.3 帶圖片(drawableXxx)的TextView:
在實際開發中,我們可能會遇到這種需求:
如圖,要實現這種效果,可能你的想法是:一個ImageView用于顯示圖片 + 一個TextView用于顯示文字,然后把他們丟到一個LinearLayout中,接著依次創建四個這樣的小布局,再另外放到一個大的LinearLayout中,效果是可以實現,但是會不會有點繁瑣呢?而且前面我們前面也說過,布局層次越少,性能越好!使用drawableXxx就可以省掉上面的過程,直接設置四個TextView就可以完成我們的需求!
基本用法:
設置圖片的核心其實就是:drawableXxx;可以設置四個方向的圖片:drawableTop(上),drawableButtom(下),drawableLeft(左),drawableRight(右) 另外,你也可以使用drawablePadding來設置圖片與文字間的間距!
效果圖:(設置四個方向上的圖片)
實現代碼:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.jay.example.test.MainActivity" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:drawableTop="@drawable/show1"
android:drawableLeft="@drawable/show1"
android:drawableRight="@drawable/show1"
android:drawableBottom="@drawable/show1"
android:drawablePadding="10dp"
android:text="張全蛋" />
</RelativeLayout>
一些問題: 可能你會發現,我們這樣設置的drawable并不能自行設置大小,在XML是無法直接設置的; 所以我們需要在Java代碼中來進行一個修改!
示例代碼如下:
package com.jay.example.test;
import android.app.Activity;
import android.graphics.drawable.Drawable;
import android.os.Bundle;
import android.widget.TextView;
public class MainActivity extends Activity {
private TextView txtZQD;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
txtZQD = (TextView) findViewById(R.id.txtZQD);
Drawable[] drawable = txtZQD.getCompoundDrawables();
// 數組下表0~3,依次是:左上右下
drawable[1].setBounds(100, 0, 200, 200);
txtZQD.setCompoundDrawables(drawable[0], drawable[1], drawable[2],
drawable[3]);
}
}
運行效果圖:
代碼分析:
①Drawable[] drawable = txtZQD.getCompoundDrawables( ); 獲得四個不同方向上的圖片資源,數組元素依次是:左上右下的圖片
②drawable[1].setBounds(100, 0, 200, 200); 接著獲得資源后,可以調用setBounds設置左上右下坐標點,比如這里設置了代表的是: 長是:從離文字最左邊開始100dp處到200dp處 寬是:從文字上方0dp處往上延伸200dp!
③txtZQD.setCompoundDrawables(drawable[0], drawable[1], drawable[2], drawable[3]);為TextView重新設置drawable數組!沒有圖片可以用null代替哦! PS:另外,從上面看出我們也可以直接在Java代碼中調用setCompoundDrawables為 TextView設置圖片!
2.4 使用autoLink屬性識別鏈接類型
當文字中出現了URL,E-Mail,電話號碼,地圖的時候,我們可以通過設置autoLink屬性;當我們點擊 文字中對應部分的文字,即可跳轉至某默認APP,比如一串號碼,點擊后跳轉至撥號界面!
看下效果圖:
all就是全部都包含,自動識別協議頭~ 在Java代碼中可以調用setAutoLinkMask(Linkify.ALL); 這個時候可以不寫協議頭,autolink會自動識別,但是還要為這個TextView設置:
setMovementMethod(LinkMovementMethod.getInstance()); 不然點擊了是沒效果的!
2.5 TextView玩轉HTML
如題,除了顯示普通文本外,TextView還預定義了一些類似于HTML的標簽,通過這些標簽,我們可以使 TextView顯示不同的字體顏色,大小,字體,甚至是顯示圖片,或者鏈接等!我們只要使用HTML中的一些 標簽,加上android.text.HTML類的支持,即可完成上述功能!
PS:當然,并不是支持所有的標簽,常用的有下述這些:
<font>:設置顏色和字體。
<big>:設置字體大號
<small>:設置字體小號
<i><b>:斜體粗體
<a>:連接網址
<img>:圖片
如果直接setText的話是沒作用的,我們需要調用Html.fromHtml()方法將字符串轉換為CharSequence接口, 然后再進行設置,如果我們需要相應設置,需要為TextView進行設置,調用下述方法: Java: setMovementMethod(LinkMovementMethod.getInstance())
嗯,接著我們寫代碼來試試:
測試文本與超鏈接標簽
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
TextView t1 = (TextView)findViewById(R.id.txtOne);
String s1 = "<font color='blue'><b>百度一下,你就知道~:</b></font><br>";
s1 += "<a ;
t1.setText(Html.fromHtml(s1));
t1.setMovementMethod(LinkMovementMethod.getInstance());
}
}
2.6跑馬燈效果
簡單說下什么是跑馬燈,就是類似于web一樣,有一行字一直循環滾滾動這樣,好吧還是看看 實現效果圖,一看就懂的了~
實現效果圖:
<TextView
android:id="@+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="40sp"
android:singleLine="true"
android:ellipsize="marquee"
android:marqueeRepeatLimit="marquee_forever"
android:text="人民日報生活漫步:莫讓千元打車費毀了專車" />
一定要設置單行顯示singleline ellipize設置為marquee就是跑馬燈屬性,
marqueeReatLimit設置marquee_forever意思為一直都是滾動模式