導言:
技術在不斷的革新,需要有新的技術代替老的方案,老的不再維護,新的一直推薦,作爲技術也不能一直停滯不前
概念:
彈性佈局(約束佈局): ConstraintLayout可以算是RelativeLayout的升級版
屏幕適配: 百分比和最小寬度從px的AndroidAutoLayout方案到dp,pm等主副單位AndroidAutoSize方案
案例步驟:
1:ConstraintLayout(彈性佈局(約束佈局)):
基本屬性:crr,clr,ctb等等,按照400x640設計圖dp編寫
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 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="@dimen/dp400"
android:layout_height="wrap_content"
tools:context="MainActivity">
<com.youth.banner.Banner
android:id="@+id/main_banner"
android:layout_width="wrap_content"
android:layout_height="315dp"
android:layout_alignParentTop="true"
android:background="#fff"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="30dp"
android:layout_alignParentTop="true"
android:alpha="0.2"
android:background="#FFFFFF"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageView
android:layout_width="100dp"
android:layout_height="17dp"
android:layout_marginLeft="15dp"
android:layout_marginTop="7dp"
android:src="@drawable/logo_main"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageView
android:id="@+id/main_exit_dialog_iv"
android:layout_width="28dp"
android:layout_height="18dp"
android:layout_marginRight="15dp"
android:layout_marginTop="4dp"
android:src="@drawable/back_button_main"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/main_notice_iv"
android:layout_width="18dp"
android:layout_height="10dp"
android:layout_marginLeft="@dimen/dp16"
android:layout_marginTop="@dimen/dp10"
android:background="@drawable/notice"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toBottomOf="@+id/main_banner" />
<TextView
android:id="@+id/main_notice_detail"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="@dimen/dp10"
android:layout_marginTop="@dimen/dp5"
android:text="@string/lottery_notice"
android:textSize="12sp"
app:layout_constraintLeft_toRightOf="@+id/main_notice_iv"
app:layout_constraintTop_toBottomOf="@+id/main_banner" />
<ImageView
android:id="@+id/main_image_iv"
android:layout_width="171dp"
android:layout_height="256dp"
android:layout_marginLeft="@dimen/dp16"
android:layout_marginTop="@dimen/dp5"
android:src="@drawable/main_image"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toBottomOf="@+id/main_notice_iv" />
<Button
android:id="@+id/main_p3_bt"
android:layout_width="55dp"
android:layout_height="@dimen/dp32"
android:layout_marginLeft="12dp"
android:layout_marginTop="@dimen/dp5"
android:background="@drawable/button_select_p3"
tools:layout_editor_absoluteX="200dp"
tools:layout_editor_absoluteY="346dp"
app:layout_constraintLeft_toRightOf="@+id/main_image_iv"
app:layout_constraintTop_toBottomOf="@+id/main_notice_detail"/>
<Button
android:id="@+id/main_p5_bt"
android:layout_width="@dimen/dp55"
android:layout_height="32dp"
android:layout_marginLeft="12dp"
android:layout_marginTop="@dimen/dp5"
android:background="@drawable/button_select_p5"
app:layout_constraintLeft_toRightOf="@+id/main_p3_bt"
app:layout_constraintTop_toBottomOf="@id/main_notice_iv" />
<Button
android:id="@+id/main_p10_bt"
android:layout_width="55dp"
android:layout_height="32dp"
android:layout_marginLeft="12dp"
android:layout_marginTop="@dimen/dp5"
android:background="@drawable/button_select_p10"
app:layout_constraintLeft_toRightOf="@id/main_p5_bt"
app:layout_constraintTop_toBottomOf="@id/main_notice_iv" />
<TextView
android:id="@+id/main_ten_tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="@dimen/dp17"
android:layout_marginTop="@dimen/dp13"
android:text="bbbbbbbbb"
android:textSize="12sp"
app:layout_constraintLeft_toRightOf="@id/main_image_iv"
app:layout_constraintTop_toBottomOf="@id/main_p3_bt" />
<TextView
android:id="@+id/main_ticket_num_tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="@dimen/dp19"
android:layout_marginRight="@dimen/dp19"
android:includeFontPadding="false"
android:text="0"
android:textColor="@color/result_view"
android:textSize="80sp"
android:textStyle="bold"
app:layout_constraintLeft_toRightOf="@+id/main_image_iv"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@+id/main_ten_tv" />
<Button
android:id="@+id/main_sub_bt"
android:layout_width="@dimen/dp60"
android:layout_height="@dimen/dp60"
android:layout_marginLeft="@dimen/dp13"
android:layout_marginTop="@dimen/dp63"
android:background="@drawable/button_select_sub"
app:layout_constraintLeft_toRightOf="@+id/main_image_iv"
app:layout_constraintTop_toBottomOf="@id/main_ten_tv" />
<Button
android:id="@+id/main_add_bt"
android:layout_width="@dimen/dp60"
android:layout_height="@dimen/dp60"
android:layout_marginLeft="@dimen/dp13"
android:layout_marginRight="@dimen/dp13"
android:layout_marginTop="@dimen/dp63"
android:background="@drawable/button_select_add"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@+id/main_ten_tv" />
<TextView
android:id="@+id/main_xjf_tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="@dimen/dp22"
android:layout_marginTop="5dp"
android:text="xxx"
android:textColor="@color/result_view"
android:textSize="12sp"
app:layout_constraintLeft_toRightOf="@+id/main_image_iv"
app:layout_constraintTop_toBottomOf="@id/main_sub_bt" />
<TextView
android:id="@+id/main_payment_tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:text="0"
android:textColor="@color/color_006"
android:textSize="12sp"
app:layout_constraintLeft_toRightOf="@+id/main_xjf_tv"
app:layout_constraintTop_toBottomOf="@id/main_sub_bt" />
<TextView
android:id="@+id/main_yuan_tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:text="aaa"
android:textColor="@color/result_view"
android:textSize="12sp"
app:layout_constraintLeft_toRightOf="@+id/main_payment_tv"
app:layout_constraintTop_toBottomOf="@id/main_sub_bt" />
<TextView
android:id="@+id/main_yuxia_tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="@dimen/dp15"
android:layout_marginTop="5dp"
android:text="yyyyy:"
android:textColor="@color/result_view"
android:textSize="12sp"
app:layout_constraintLeft_toRightOf="@+id/main_yuan_tv"
app:layout_constraintTop_toBottomOf="@id/main_sub_bt" />
<TextView
android:id="@+id/main_ticket_surplus_tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:text="0"
android:textColor="@color/color_006"
android:textSize="12sp"
app:layout_constraintLeft_toRightOf="@+id/main_yuxia_tv"
app:layout_constraintTop_toBottomOf="@id/main_sub_bt" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:text="aaa"
android:textColor="@color/result_view"
android:textSize="12sp"
app:layout_constraintLeft_toRightOf="@+id/main_ticket_surplus_tv"
app:layout_constraintTop_toBottomOf="@id/main_sub_bt" />
<Button
android:id="@+id/main_go_payment_bt"
android:layout_width="186dp"
android:layout_height="43dp"
android:layout_marginLeft="@dimen/dp13"
android:layout_marginTop="@dimen/dp5"
android:background="@drawable/go_buy"
app:layout_constraintLeft_toRightOf="@+id/main_image_iv"
app:layout_constraintTop_toBottomOf="@id/main_xjf_tv" />
<TextView
android:id="@+id/main_device_tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="@dimen/dp15"
android:layout_marginTop="@dimen/dp10"
android:text="aaaaa: "
android:textSize="11sp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toBottomOf="@+id/main_image_iv" />
<TextView
android:id="@+id/main_device_serial_num_tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/dp10"
android:text="00000000"
android:textSize="11sp"
app:layout_constraintLeft_toRightOf="@+id/main_device_tv"
app:layout_constraintTop_toBottomOf="@+id/main_image_iv" />
</android.support.constraint.ConstraintLayout>
2:AndroidAutoSize
2.1:導包
implementation 'me.jessyan:autosize:1.1.0'
2.2:配置androidmainfest,這個是按照UI給的設計圖
<meta-data
android:name="design_width_in_dp"
android:value="400" />
<meta-data
android:name="design_height_in_dp"
android:value="640" />
2.3:其他API
CustomAdapt:修改當前頁面的設計圖尺寸
public class MainActivity extends AppCompatActivity implements CustomAdapt {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ButterKnife.inject(this);
}
// @return {@code true} 爲按照寬度進行適配, {@code false} 爲按照高度進行適配
@Override
public boolean isBaseOnWidth() {
return true;
}
//根據上面這個賦值,比如原圖是寬度400適配,這個改成360寬度
@Override
public float getSizeInDp() {
return 360;
}
}
CancelAdapt :保存原樣,放棄自動適配
ok,結束,以後就用這個.