Skip to content

Commit 3d07269

Browse files
xuexiangjysxuexiangjys
committed
增加更多约束布局ConstraintLayout的使用案例
1 parent 027714c commit 3d07269

File tree

11 files changed

+685
-2
lines changed

11 files changed

+685
-2
lines changed

‎app/src/main/java/com/xuexiang/xuidemo/fragment/expands/materialdesign/ConstraintLayoutFragment.java‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,10 @@
2121
import com.xuexiang.xpage.core.PageOption;
2222
import com.xuexiang.xuidemo.R;
2323
import com.xuexiang.xuidemo.base.BaseSimpleListFragment;
24+
import com.xuexiang.xuidemo.fragment.expands.materialdesign.constraintlayout.ConstraintLayoutConstraintSetFragment;
2425
import com.xuexiang.xuidemo.fragment.expands.materialdesign.constraintlayout.ConstraintLayoutContainerFragment;
26+
import com.xuexiang.xuidemo.fragment.expands.materialdesign.constraintlayout.ConstraintLayoutGroupFragment;
27+
import com.xuexiang.xuidemo.fragment.expands.materialdesign.constraintlayout.ConstraintLayoutPlaceholderFragment;
2528

2629
import java.util.List;
2730

@@ -41,6 +44,10 @@ protected List<String> initSimpleData(List<String> lists) {
4144
lists.add("尺寸约束");
4245
lists.add("链约束");
4346
lists.add("导航线Guideline使用");
47+
lists.add("栅栏Barrier使用");
48+
lists.add("分组Group使用");
49+
lists.add("占位符Placeholder使用");
50+
lists.add("ConstraintSet实现切换动画");
4451
return lists;
4552
}
4653

@@ -59,6 +66,18 @@ protected void onItemClick(int position) {
5966
case 3:
6067
gotoExample(mSimpleData.get(position), R.layout.layout_constraint_guideline);
6168
break;
69+
case 4:
70+
gotoExample(mSimpleData.get(position), R.layout.layout_constraint_barrier);
71+
break;
72+
case 5:
73+
openPage(ConstraintLayoutGroupFragment.class);
74+
break;
75+
case 6:
76+
openPage(ConstraintLayoutPlaceholderFragment.class);
77+
break;
78+
case 7:
79+
openPage(ConstraintLayoutConstraintSetFragment.class);
80+
break;
6281
default:
6382
break;
6483
}

‎app/src/main/java/com/xuexiang/xuidemo/fragment/expands/materialdesign/constraintlayout/ConstraintLayoutConstraintSetFragment.java‎

Lines changed: 83 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,83 @@
1+
/*
2+
* Copyright (C) 2020 xuexiangjys(xuexiangjys@163.com)
3+
*
4+
* Licensed under the Apache License, Version 2.0 (the "License");
5+
* you may not use this file except in compliance with the License.
6+
* You may obtain a copy of the License at
7+
*
8+
* http://www.apache.org/licenses/LICENSE-2.0
9+
*
10+
* Unless required by applicable law or agreed to in writing, software
11+
* distributed under the License is distributed on an "AS IS" BASIS,
12+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13+
* See the License for the specific language governing permissions and
14+
* limitations under the License.
15+
*
16+
*/
17+
18+
package com.xuexiang.xuidemo.fragment.expands.materialdesign.constraintlayout;
19+
20+
import android.os.Build;
21+
import android.transition.TransitionManager;
22+
import android.view.View;
23+
import android.widget.ImageView;
24+
import android.widget.TextView;
25+
26+
import androidx.constraintlayout.widget.ConstraintLayout;
27+
import androidx.constraintlayout.widget.ConstraintSet;
28+
29+
import com.xuexiang.xaop.annotation.SingleClick;
30+
import com.xuexiang.xpage.annotation.Page;
31+
import com.xuexiang.xuidemo.R;
32+
import com.xuexiang.xuidemo.base.BaseFragment;
33+
34+
import butterknife.BindView;
35+
import butterknife.OnClick;
36+
37+
/**
38+
* @author xuexiang
39+
* @since 2020-01-09 13:38
40+
*/
41+
@Page(name = "ConstraintSet实现切换动画")
42+
public class ConstraintLayoutConstraintSetFragment extends BaseFragment {
43+
private boolean mShowBigImage = false;
44+
45+
@BindView(R.id.constraint_layout)
46+
ConstraintLayout constraintLayout;
47+
48+
private ConstraintSet mConstraintSetNormal = new ConstraintSet();
49+
private ConstraintSet mConstraintSetBig = new ConstraintSet();
50+
51+
@Override
52+
protected int getLayoutId() {
53+
return R.layout.layout_constraintset_normal;
54+
}
55+
56+
@Override
57+
protected void initViews() {
58+
mConstraintSetNormal.clone(constraintLayout);
59+
mConstraintSetBig.load(getContext(), R.layout.layout_constraintset_big);
60+
}
61+
62+
@SingleClick
63+
@OnClick(R.id.iv_content)
64+
public void onViewClicked(View view) {
65+
toggleMode();
66+
}
67+
68+
public void toggleMode() {
69+
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
70+
TransitionManager.beginDelayedTransition(constraintLayout);
71+
}
72+
mShowBigImage = !mShowBigImage;
73+
applyConfig();
74+
}
75+
76+
private void applyConfig() {
77+
if (mShowBigImage) {
78+
mConstraintSetBig.applyTo(constraintLayout);
79+
} else {
80+
mConstraintSetNormal.applyTo(constraintLayout);
81+
}
82+
}
83+
}

‎app/src/main/java/com/xuexiang/xuidemo/fragment/expands/materialdesign/constraintlayout/ConstraintLayoutGroupFragment.java‎

Lines changed: 77 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,77 @@
1+
/*
2+
* Copyright (C) 2020 xuexiangjys(xuexiangjys@163.com)
3+
*
4+
* Licensed under the Apache License, Version 2.0 (the "License");
5+
* you may not use this file except in compliance with the License.
6+
* You may obtain a copy of the License at
7+
*
8+
* http://www.apache.org/licenses/LICENSE-2.0
9+
*
10+
* Unless required by applicable law or agreed to in writing, software
11+
* distributed under the License is distributed on an "AS IS" BASIS,
12+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13+
* See the License for the specific language governing permissions and
14+
* limitations under the License.
15+
*
16+
*/
17+
18+
package com.xuexiang.xuidemo.fragment.expands.materialdesign.constraintlayout;
19+
20+
import android.view.View;
21+
import android.widget.CompoundButton;
22+
23+
import androidx.constraintlayout.widget.Group;
24+
25+
import com.xuexiang.xpage.annotation.Page;
26+
import com.xuexiang.xui.widget.button.switchbutton.SwitchButton;
27+
import com.xuexiang.xuidemo.R;
28+
import com.xuexiang.xuidemo.base.BaseFragment;
29+
30+
import butterknife.BindView;
31+
32+
/**
33+
* @author xuexiang
34+
* @since 2020-01-09 11:22
35+
*/
36+
@Page(name = "分组Group使用")
37+
public class ConstraintLayoutGroupFragment extends BaseFragment implements CompoundButton.OnCheckedChangeListener {
38+
@BindView(R.id.sb_group)
39+
SwitchButton sbGroup;
40+
@BindView(R.id.sb_group2)
41+
SwitchButton sbGroup2;
42+
@BindView(R.id.group)
43+
Group group;
44+
@BindView(R.id.group2)
45+
Group group2;
46+
47+
@Override
48+
protected int getLayoutId() {
49+
return R.layout.layout_constraint_group;
50+
}
51+
52+
@Override
53+
protected void initViews() {
54+
sbGroup.setChecked(true);
55+
sbGroup2.setChecked(true);
56+
}
57+
58+
@Override
59+
protected void initListeners() {
60+
sbGroup.setOnCheckedChangeListener(this);
61+
sbGroup2.setOnCheckedChangeListener(this);
62+
}
63+
64+
@Override
65+
public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
66+
switch (buttonView.getId()) {
67+
case R.id.sb_group:
68+
group.setVisibility(isChecked ? View.VISIBLE : View.GONE);
69+
break;
70+
case R.id.sb_group2:
71+
group2.setVisibility(isChecked ? View.VISIBLE : View.GONE);
72+
break;
73+
default:
74+
break;
75+
}
76+
}
77+
}

‎app/src/main/java/com/xuexiang/xuidemo/fragment/expands/materialdesign/constraintlayout/ConstraintLayoutPlaceholderFragment.java‎

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
/*
2+
* Copyright (C) 2020 xuexiangjys(xuexiangjys@163.com)
3+
*
4+
* Licensed under the Apache License, Version 2.0 (the "License");
5+
* you may not use this file except in compliance with the License.
6+
* You may obtain a copy of the License at
7+
*
8+
* http://www.apache.org/licenses/LICENSE-2.0
9+
*
10+
* Unless required by applicable law or agreed to in writing, software
11+
* distributed under the License is distributed on an "AS IS" BASIS,
12+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13+
* See the License for the specific language governing permissions and
14+
* limitations under the License.
15+
*
16+
*/
17+
18+
package com.xuexiang.xuidemo.fragment.expands.materialdesign.constraintlayout;
19+
20+
import android.view.View;
21+
import android.view.animation.OvershootInterpolator;
22+
23+
import androidx.constraintlayout.widget.ConstraintLayout;
24+
import androidx.constraintlayout.widget.Placeholder;
25+
import androidx.transition.ChangeBounds;
26+
import androidx.transition.TransitionManager;
27+
28+
import com.xuexiang.xaop.annotation.SingleClick;
29+
import com.xuexiang.xpage.annotation.Page;
30+
import com.xuexiang.xuidemo.R;
31+
import com.xuexiang.xuidemo.base.BaseFragment;
32+
33+
import butterknife.BindView;
34+
import butterknife.OnClick;
35+
36+
/**
37+
* @author xuexiang
38+
* @since 2020-01-09 11:36
39+
*/
40+
@Page(name = "占位符Placeholder使用")
41+
public class ConstraintLayoutPlaceholderFragment extends BaseFragment {
42+
@BindView(R.id.constraint_layout)
43+
ConstraintLayout constraintLayout;
44+
@BindView(R.id.place_holder)
45+
Placeholder placeHolder;
46+
47+
@Override
48+
protected int getLayoutId() {
49+
return R.layout.layout_constraint_placeholder;
50+
}
51+
52+
@Override
53+
protected void initViews() {
54+
55+
}
56+
57+
@SingleClick
58+
@OnClick({R.id.tv_1, R.id.tv_2, R.id.tv_3})
59+
public void onViewClicked(View view) {
60+
//切换占位控件
61+
placeHolder.setContentId(view.getId());
62+
//切换动画
63+
TransitionManager.beginDelayedTransition(constraintLayout, new ChangeBounds()
64+
.setInterpolator(new OvershootInterpolator()).setDuration(1000));
65+
}
66+
}

‎app/src/main/res/layout/layout_constraint_barrier.xml‎

Lines changed: 76 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,76 @@
1+
<?xml version="1.0" encoding="utf-8"?><!--
2+
~ Copyright (C) 2020 xuexiangjys(xuexiangjys@163.com)
3+
~
4+
~ Licensed under the Apache License, Version 2.0 (the "License");
5+
~ you may not use this file except in compliance with the License.
6+
~ You may obtain a copy of the License at
7+
~
8+
~ http://www.apache.org/licenses/LICENSE-2.0
9+
~
10+
~ Unless required by applicable law or agreed to in writing, software
11+
~ distributed under the License is distributed on an "AS IS" BASIS,
12+
~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13+
~ See the License for the specific language governing permissions and
14+
~ limitations under the License.
15+
~
16+
-->
17+
18+
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
19+
xmlns:app="http://schemas.android.com/apk/res-auto"
20+
android:layout_width="match_parent"
21+
android:layout_height="match_parent"
22+
android:orientation="vertical">
23+
24+
<androidx.constraintlayout.widget.ConstraintLayout
25+
android:layout_width="match_parent"
26+
android:layout_height="match_parent"
27+
android:layout_marginTop="@dimen/spacing_16">
28+
29+
<!-- 栅栏组件（不显示），设置 app:barrierDirection和app:constraint_referenced_ids属性 -->
30+
<androidx.constraintlayout.widget.Barrier
31+
android:id="@+id/barrier"
32+
android:layout_width="wrap_content"
33+
android:layout_height="wrap_content"
34+
app:barrierDirection="end"
35+
app:constraint_referenced_ids="tvPhone,tvPassword" />
36+
37+
<TextView
38+
android:id="@+id/tvPhone"
39+
android:layout_width="wrap_content"
40+
android:layout_height="50dp"
41+
android:background="@color/app_color_theme_1"
42+
android:gravity="center_vertical|start"
43+
android:padding="10dp"
44+
android:text="手机号码"
45+
android:textColor="@color/white" />
46+
47+
<TextView
48+
android:id="@+id/tvPassword"
49+
android:layout_width="wrap_content"
50+
android:layout_height="50dp"
51+
android:background="@color/app_color_theme_2"
52+
android:gravity="center_vertical|start"
53+
android:padding="10dp"
54+
android:text="密码"
55+
android:textColor="@color/white"
56+
app:layout_constraintTop_toBottomOf="@id/tvPhone" />
57+
58+
<EditText
59+
android:id="@+id/etPassword"
60+
android:layout_width="0dp"
61+
android:layout_height="50dp"
62+
android:hint="输入手机号码"
63+
app:layout_constraintStart_toStartOf="@id/barrier"
64+
app:layout_constraintWidth_percent="0.5" />
65+
66+
<EditText
67+
android:layout_width="0dp"
68+
android:layout_height="50dp"
69+
android:hint="输入密码"
70+
app:layout_constraintStart_toStartOf="@id/barrier"
71+
app:layout_constraintTop_toBottomOf="@id/etPassword"
72+
app:layout_constraintWidth_percent="0.5" />
73+
74+
</androidx.constraintlayout.widget.ConstraintLayout>
75+
76+
</LinearLayout>

0 commit comments

Comments
 (0)