Android進階：網路與資料儲存—步驟1：Android網路與通訊(第7小節：CadView)
阿新 • • 發佈：2018-12-13
內容概要：
- CardView基礎
- CardView介紹
- CardVie常用屬性
- CardView屬性效果展示
- CardView案例實現
- CardVie基本操作
- 案例-佈局搭建
- 案例-實體類建立
- 案例-功能實現
- 案例-適配
- CardView開發注意事項
一、CardView基礎
1、CardView介紹
CardView是什麼？
- Android5.0之後新增
- com.android.support:cardview-v7:26.1.0獨立引用
- 繼承自FragmeLayout，方便作為其他控制元件的容器，新增3D陰影和圓角效果
2.CardVie常用屬性
-
cardBackgroundColor 設定背景色
-
cardCornerRadius 設定圓角半徑
-
contentPadding 設定內部padding
-
cardElevation 設定陰影大小
-
cardUseCompatPadding 預設為false, 用於5.0及以上,true則新增額外的padding繪製陰影
-
cardPreventCornerOverlap 預設為true, 用於5.0以下,新增額外的padding,防止內容和圓角重疊
-
示例：
程式碼演示：
首先在build.gradle新增依賴包
implementation 'com.android.support:cardview-v7:26.1.0'
最簡單的應用給textView設定一個陰影效果：
<?xml version="1.0" encoding="utf-8"?> <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".MainActivity"> <android.support.v7.widget.CardView android:layout_gravity="center" android:layout_width="wrap_content" android:layout_height="wrap_content"> <TextView android:layout_width="200dp" android:layout_height="50dp" android:text="Hello World!" android:gravity="center" /> </android.support.v7.widget.CardView> </FrameLayout>
2.案例-佈局搭建
在寫佈局檔案的時候，比如text的初始值我們可以設定一個隨意的文字，但是我們只想自己測試預覽看到
不想被意外的顯示在App上，可以在主View上加tools
xmlns:tools="http://schemas.android.com/tools"
然後再相應你想測試的值預覽的地方加上
//這個預覽和在app都可以看到
android:text="Hello World!"
//這個只能預覽效果，app上不顯示內容
tools:text="Hello World!"item_msg.xml CardView的佈局
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_marginTop="8dp"
app:cardCornerRadius="10dp"
app:cardElevation="6dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:id="@+id/id_image_cardview"
android:layout_width="match_parent"
android:layout_height="150dp"
android:scaleType="centerCrop"
tools:background="@drawable/img01" />
<TextView
android:id="@+id/id_title_cardview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:text="Hello World!"
tools:text="aaaaaa" />
<TextView
android:id="@+id/id_content_cardview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:text="Hello World!"
tools:text="aaaaaa" />
</LinearLayout>
</android.support.v7.widget.CardView>
</FrameLayout>ListView顯示CardView
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<ListView
android:id="@+id/listview"
android:background="#ffffff"
android:layout_width="match_parent"
android:layout_height="match_parent">
</ListView>
</LinearLayout>3案例-實體類建立
Msg.java
/**
* 資訊封裝類
*/
public class Msg {
private int Id;
private int ImgId;
private String Tilte;
private String Content;
public Msg(int id, int imgId, String tilte, String content) {
Id = id;
ImgId = imgId;
Tilte = tilte;
Content = content;
}
public int getId() {
return Id;
}
public void setId(int id) {
Id = id;
}
public int getImgId() {
return ImgId;
}
public void setImgId(int imgId) {
ImgId = imgId;
}
public String getTilte() {
return Tilte;
}
public void setTilte(String tilte) {
Tilte = tilte;
}
public String getContent() {
return Content;
}
public void setContent(String content) {
Content = content;
}
}
MsgLab.java
/**
* 資訊的類新增
*/
public class MsgLab {
private List<Msg> list;
public static List<Msg> generateList(){
List<Msg> msgList=new ArrayList<>();
Msg msg = new Msg(1,
R.drawable.img01,
"如何才能不錯過人工智慧的時代？",
"下一個時代就是機器學習的時代，慕課網發大招，與你一起預見未來！");
msgList.add(msg);
msg = new Msg(2,
R.drawable.img02,
"關於你的面試、實習心路歷程",
"獎品豐富，更設有參與獎，隨機抽取5名幸運使用者，獲得慕課網付費面試課程中的任意一門！");
msgList.add(msg);
msg = new Msg(3,
R.drawable.img03,
"狗糧不是你想吃，就能吃的！",
"你的朋友圈開始了嗎？一半秀恩愛，一半扮感傷！不怕，還有慕課網陪你堅強地走下去！！");
msgList.add(msg);
msg = new Msg(4,
R.drawable.img04,
"前端跳槽面試那些事兒",
"工作有幾年了，專案偏簡單有點拿不出手怎麼辦？ 目前還沒畢業，正在自學前端，請問可以找到一份前端工作嗎，我該怎麼辦？");
msgList.add(msg);
msg = new Msg(5,
R.drawable.img05,
"圖解程式設計師怎麼過七夕？",
"哈哈哈哈，活該單身25年！");
msgList.add(msg);
return msgList;
}
}
4.案例-功能實現
public class MainActivity extends AppCompatActivity {
private ListView listView;
private List<Msg> msgs=new ArrayList<>();
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
listView=findViewById(R.id.listview);
msgs.addAll(MsgLab.generateList());//給msgs新增資料
msgs.addAll(MsgLab.generateList());//給msgs新增資料
listView.setAdapter(new MsgAdapter(MainActivity.this,msgs));
}
}實現效果：
CardView螢幕適配
一、手機適配之 dimen 基礎知識
dimen 是用來定義尺寸的資原始檔,預設路徑:工程的 res\values\dimens.xml
二、dimen 定義的尺寸資原始檔作用?
可以在 res 下建立不同解析度的 values 目錄,例如 values-480x320、values-800x480、 values-1920x1080、vaule-21是android5.0 等,並且在上述目錄中可以分別建立尺寸檔案,這樣在不同解析度 下,該目錄下的 dimens.xml 會代替 res/values/dimens.xml 達到最佳的適配效果。
三、dimen 定義的資原始檔如何使用?
1、 在工程的 res\values\目錄下建立一個 dimens.xml 尺寸資原始檔 <?xml version="1.0" encoding="utf-8"?>
<resources>
<dimen name="btn_width">200px</dimen>
<dimen name="btn_height">200px</dimen> </resources>2、 新增一個佈局檔案,在此佈局檔案中新增一個按鈕,使用尺寸資原始檔來定義按鈕 的寬和高
<?xml version="1.0" encoding="utf-8"?> <LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:layout_width="@dimen/btn_width"
android:layout_height="@dimen/btn_height"
android:text="@string/app_name" />
</LinearLayout>3、在 java 程式碼中也可以獲取到 dimens 尺寸資原始檔的數值
Resources res = getResources();
float btn_h = res.getDimension(R.dimen.btn_height); float btn_w = res.getDimension(R.dimen.btn_width);四、尺寸檔案使用建議
1、在 values 目錄下建立一個預設的 dimens 檔案
2、儘可能多的建立不同解析度的 dimens 檔案(這樣應用才會適配的完美)