網站首頁 編程語言 正文
實踐過程
代碼修改約束
<?xml version="1.0" encoding="utf-8"?> <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:id="@+id/idConstraintLayout" android:layout_width="match_parent" android:layout_height="match_parent"> <TextView android:id="@+id/idTxt" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@color/color_00ff00" android:padding="10dp" android:text="芝麻粒兒" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintStart_toStartOf="parent" /> <Button android:id="@+id/idBtn" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="變化" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" /> </androidx.constraintlayout.widget.ConstraintLayout>
public class ActivityJavaConstraintLayout extends AppCompatActivity {
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_java_constraint);
ConstraintLayout idConstraintLayout = findViewById(R.id.idConstraintLayout);
findViewById(R.id.idBtn).setOnClickListener(v -> {
ConstraintSet constraintSet = new ConstraintSet();
constraintSet.clone(idConstraintLayout);
//設置相對父布局劇中
constraintSet.centerHorizontally(R.id.idTxt, ConstraintSet.PARENT_ID);
constraintSet.centerVertically(R.id.idTxt, ConstraintSet.PARENT_ID);
//可以添加動畫
TransitionManager.beginDelayedTransition(idConstraintLayout);
constraintSet.applyTo(idConstraintLayout);
});
//還有其他形式 控件A底部和空間B頂部對其 等同于xml中屬性 app:layout_constraintBottom_toTopOf
// constraintSet.connect(R.id.idTxtA, ConstraintSet.BOTTOM, R.id.idTxtB, ConstraintSet.TOP);
}
}
除了上面的效果,我們還能實現切換布局的時候,相同控件動畫化。我們準備兩個布局,布局內id一致,但是位置不同。
布局A如下:
<?xml version="1.0" encoding="utf-8"?> <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:id="@+id/idConstraintLayout" android:layout_width="match_parent" android:layout_height="match_parent"> <TextView android:id="@+id/idTxt" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@color/color_00ff00" android:padding="10dp" android:text="芝麻粒兒" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintStart_toStartOf="parent" /> <Button android:id="@+id/idBtn" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="變化" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" /> <Button android:id="@+id/idBtnBack" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="回去" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" /> </androidx.constraintlayout.widget.ConstraintLayout>
布局B如下:
<?xml version="1.0" encoding="utf-8"?> <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:id="@+id/idConstraintLayout" android:layout_width="match_parent" android:layout_height="match_parent"> <TextView android:id="@+id/idTxt" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@color/color_00ff00" android:padding="10dp" android:text="芝麻粒兒" app:layout_constraintTop_toTopOf="parent" app:layout_constraintEnd_toEndOf="parent" /> <Button android:id="@+id/idBtn" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="變化" app:layout_constraintTop_toTopOf="parent" app:layout_constraintStart_toStartOf="parent" /> <Button android:id="@+id/idBtnBack" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="回去" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintStart_toStartOf="parent" /> </androidx.constraintlayout.widget.ConstraintLayout>
public class ActivityJavaConstraintLayout extends AppCompatActivity {
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_java_constraint);
ConstraintLayout idConstraintLayout = findViewById(R.id.idConstraintLayout);
//變化
findViewById(R.id.idBtn).setOnClickListener(v ->{
ConstraintSet constraintSet = new ConstraintSet();
constraintSet.clone(this,R.layout.activity_java_constraint_b);
TransitionManager.beginDelayedTransition(idConstraintLayout);
constraintSet.applyTo(idConstraintLayout);
});
//恢復
findViewById(R.id.idBtnBack).setOnClickListener(v->{
ConstraintSet constraintSet = new ConstraintSet();
constraintSet.clone(this,R.layout.activity_java_constraint);
TransitionManager.beginDelayedTransition(idConstraintLayout);
constraintSet.applyTo(idConstraintLayout);
});
}
}
??輔助功能
Guideline
表示輔助線,需要使用單獨的不是你實際布局的View控件來做,因為是輔助工具,所以真實運行的時候不會繪制,僅在你寫布局的時候幫助你繪制,輔助你完成布局,有三個相關屬性:
app:layout_constraintGuide_percent=“0.5” 在父布局的百分比位置。
app:layout_constraintGuide_begin=“10dp” 距離父布局開始位置,橫向為左,縱向為頂部。
app:layout_constraintGuide_end=“10dp” 距離父布局末尾位置。
需要和android:orientation結合使用,vertical是縱輔助線,horizontal是橫向輔助線。
Barrier
寓意屏障,比如我們有幾個不固定寬度或高度的控件,而有一個控件想一直在這幾個中的最長的那個控件邊緣對其,按照以前我們是將這幾個控件包裹嵌套一層來實現。但是ConstraintLayout可以使用Barrier輔助工具實現。重點有兩個屬性app:barrierDirection表示屏障在目標控件的哪個方向,app:constraint_referenced_ids指定目標控件,注意多個逗號隔開。
<TextView android:id="@+id/idTxt1" ... /> <TextView android:id="@+id/idTxt2" app:layout_constraintTop_toBottomOf="@+id/idTxt1" ... /> <androidx.constraintlayout.widget.Barrier android:id="@+id/idBarrier" android:layout_width="wrap_content" android:layout_height="wrap_content" app:barrierDirection="right" app:constraint_referenced_ids="idTxt1,idTxt2" /> <TextView android:id="@+id/idTxt3" app:layout_constraintLeft_toRightOf="@id/idBarrier" ... />
Flow
這是網格布局,不具體介紹了,就說一下屬性吧。
- app:flow_wrapMode="aligned":有3個值:aligned-絕對對齊(和網格對齊類似);none-默認方式,成為一排,寬度不夠,從兩邊出去;chain-和絕對對齊有點出入的是,比如6個元素,第一排4個,第二排是2個,這2個元素會平分橫屏寬度
- app:flow_verticalGap和app:flow_horizontalGap:表示豎直間距或橫向間距
- android:orientation="horizontal":水平方向的流式還是豎直方向的流式
- app:flow_maxElementsWrap="":表示一行幾個元素
- app:flow_verticalAlign="top":有四個值:top,bottom,center,baseline。每一行元素的對齊方式
- app:flow_horizontalBias="float":low的bias偏移,只在style為packed時生效
- app:flow_horizontalStyle="spread|spread_inside|packed":當wrapMode為chain或ALIGNED時生效
Placeholder
這節其實算是和小重點,感興趣的自己去搜索吧,主要作用是占位功能,占位之后其他控件可以通過setContentId移動到該位置。
Group和Layer
能很好的控制多個控件的顯示和隱藏。app:constraint_referenced_ids指定目標控件的id,多個逗號隔開。
<androidx.constraintlayout.widget.Group android:id="@+id/idGroup" android:layout_width="wrap_content" android:layout_height="wrap_content" android:visibility="visible" app:constraint_referenced_ids="idTxt,idBtn" />
Layer不僅能實現Group的隱藏,還能修改背景,使用方式和Group一致。
原文鏈接:https://juejin.cn/post/7145392443268005896
相關推薦
- 2022-09-14 python單鏈路性能測試實踐_python
- 2023-01-26 Android入門之使用SQLite內嵌式數據庫詳解_Android
- 2022-07-13 仿 OriginOS 無清理項動畫
- 2022-11-21 QT通過C++線程池運行Lambda自定義函數流程詳解_C 語言
- 2022-07-10 數組的遍歷方法有哪些
- 2022-10-21 一文帶你入門Go語言中定時任務庫Cron的使用_Golang
- 2022-11-07 將.py文件轉化為.exe文件的詳細過程_python
- 2022-04-25 Entity?Framework?Core中執行SQL語句和存儲過程的方法介紹_實用技巧
- 最近更新
-
- window11 系統安裝 yarn
- 超詳細win安裝深度學習環境2025年最新版(
- Linux 中運行的top命令 怎么退出?
- MySQL 中decimal 的用法? 存儲小
- get 、set 、toString 方法的使
- @Resource和 @Autowired注解
- Java基礎操作-- 運算符,流程控制 Flo
- 1. Int 和Integer 的區別,Jav
- spring @retryable不生效的一種
- Spring Security之認證信息的處理
- Spring Security之認證過濾器
- Spring Security概述快速入門
- Spring Security之配置體系
- 【SpringBoot】SpringCache
- Spring Security之基于方法配置權
- redisson分布式鎖中waittime的設
- maven:解決release錯誤:Artif
- restTemplate使用總結
- Spring Security之安全異常處理
- MybatisPlus優雅實現加密?
- Spring ioc容器與Bean的生命周期。
- 【探索SpringCloud】服務發現-Nac
- Spring Security之基于HttpR
- Redis 底層數據結構-簡單動態字符串(SD
- arthas操作spring被代理目標對象命令
- Spring中的單例模式應用詳解
- 聊聊消息隊列,發送消息的4種方式
- bootspring第三方資源配置管理
- GIT同步修改后的遠程分支