├── .gitignore ├── .idea ├── compiler.xml ├── copyright │ └── profiles_settings.xml ├── dictionaries │ └── wangchenlong.xml ├── encodings.xml ├── gradle.xml ├── markdown-navigator │ └── profiles_settings.xml ├── misc.xml ├── modules.xml ├── runConfigurations.xml └── vcs.xml ├── README.md ├── app ├── .gitignore ├── build.gradle ├── proguard-rules.pro └── src │ ├── androidTest │ └── java │ │ └── org │ │ └── wangchenlong │ │ └── constraintlayoutdemo │ │ └── ExampleInstrumentedTest.java │ ├── main │ ├── AndroidManifest.xml │ ├── java │ │ └── org │ │ │ └── wangchenlong │ │ │ └── constraintlayoutdemo │ │ │ ├── LayoutDisplayActivity.java │ │ │ └── MainActivity.java │ └── res │ │ ├── drawable │ │ └── total_large.jpg │ │ ├── layout │ │ ├── activity_main.xml │ │ ├── layout_aspect_ratio.xml │ │ ├── layout_base.xml │ │ ├── layout_bias.xml │ │ ├── layout_guide_line.xml │ │ └── layout_measure.xml │ │ ├── mipmap-hdpi │ │ └── ic_launcher.png │ │ ├── mipmap-mdpi │ │ └── ic_launcher.png │ │ ├── mipmap-xhdpi │ │ └── ic_launcher.png │ │ ├── mipmap-xxhdpi │ │ └── ic_launcher.png │ │ ├── mipmap-xxxhdpi │ │ └── ic_launcher.png │ │ ├── values-w820dp │ │ └── dimens.xml │ │ └── values │ │ ├── colors.xml │ │ ├── dimens.xml │ │ ├── strings.xml │ │ └── styles.xml │ └── test │ └── java │ └── org │ └── wangchenlong │ └── constraintlayoutdemo │ └── ExampleUnitTest.java ├── build.gradle ├── gradle.properties ├── gradle └── wrapper │ ├── gradle-wrapper.jar │ └── gradle-wrapper.properties ├── gradlew ├── gradlew.bat └── settings.gradle /.gitignore: -------------------------------------------------------------------------------- 1 | *.iml 2 | .gradle 3 | /local.properties 4 | /.idea/workspace.xml 5 | /.idea/libraries 6 | .DS_Store 7 | /build 8 | /captures 9 | .externalNativeBuild 10 | -------------------------------------------------------------------------------- /.idea/compiler.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | -------------------------------------------------------------------------------- /.idea/copyright/profiles_settings.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | -------------------------------------------------------------------------------- /.idea/dictionaries/wangchenlong.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | -------------------------------------------------------------------------------- /.idea/encodings.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /.idea/gradle.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 17 | 18 | -------------------------------------------------------------------------------- /.idea/markdown-navigator/profiles_settings.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | -------------------------------------------------------------------------------- /.idea/misc.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 12 | 13 | 14 | 26 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | Android > Lint > Correctness 46 | 47 | 48 | C/C++ 49 | 50 | 51 | Data flow issuesJava 52 | 53 | 54 | General 55 | 56 | 57 | Java 58 | 59 | 60 | Unused codeC/C++ 61 | 62 | 63 | 64 | 65 | Android 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 87 | 88 | $USER_HOME$/.subversion 89 | 90 | 91 | 92 | 93 | 94 | 1.8 95 | 96 | 101 | 102 | 103 | 104 | 105 | 106 | 107 | 112 | 113 | 114 | 115 | 116 | 117 | -------------------------------------------------------------------------------- /.idea/modules.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | -------------------------------------------------------------------------------- /.idea/runConfigurations.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 11 | 12 | -------------------------------------------------------------------------------- /.idea/vcs.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # 探索约束布局(ConstraintLayout)概念与使用 2 | 3 | 熟练掌握 ConstraintLayout 的开发技术 4 | 5 | 工程文档：https://www.jianshu.com/p/32a0a6e0a98a 6 | 7 | 本文的合集已经编著成书，**[高级Android开发强化实战](https://item.jd.com/12385680.html)**，欢迎各位读友的建议和指导。 8 | 9 | 在京东即可购买：https://item.jd.com/12385680.html 10 | -------------------------------------------------------------------------------- /app/.gitignore: -------------------------------------------------------------------------------- 1 | /build 2 | -------------------------------------------------------------------------------- /app/build.gradle: -------------------------------------------------------------------------------- 1 | apply plugin: 'com.android.application' 2 | 3 | android { 4 | compileSdkVersion 24 5 | buildToolsVersion '25.0.0' 6 | defaultConfig { 7 | applicationId "org.wangchenlong.constraintlayoutdemo" 8 | minSdkVersion 17 9 | targetSdkVersion 24 10 | versionCode 1 11 | versionName "1.0" 12 | testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner" 13 | } 14 | buildTypes { 15 | release { 16 | minifyEnabled false 17 | proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro' 18 | } 19 | } 20 | } 21 | 22 | dependencies { 23 | compile fileTree(dir: 'libs', include: ['*.jar']) 24 | androidTestCompile('com.android.support.test.espresso:espresso-core:2.2.2', { 25 | exclude group: 'com.android.support', module: 'support-annotations' 26 | }) 27 | compile 'com.android.support:appcompat-v7:24.1.1' 28 | // 默认添加ConstraintLayout的依赖 29 | compile 'com.android.support.constraint:constraint-layout:1.0.2' 30 | testCompile 'junit:junit:4.12' 31 | } 32 | -------------------------------------------------------------------------------- /app/proguard-rules.pro: -------------------------------------------------------------------------------- 1 | # Add project specific ProGuard rules here. 2 | # By default, the flags in this file are appended to flags specified 3 | # in /Users/wangchenlong/Installations/android-sdk/tools/proguard/proguard-android.txt 4 | # You can edit the include path and order by changing the proguardFiles 5 | # directive in build.gradle. 6 | # 7 | # For more details, see 8 | # http://developer.android.com/guide/developing/tools/proguard.html 9 | 10 | # Add any project specific keep options here: 11 | 12 | # If your project uses WebView with JS, uncomment the following 13 | # and specify the fully qualified class name to the JavaScript interface 14 | # class: 15 | #-keepclassmembers class fqcn.of.javascript.interface.for.webview { 16 | # public *; 17 | #} 18 | -------------------------------------------------------------------------------- /app/src/androidTest/java/org/wangchenlong/constraintlayoutdemo/ExampleInstrumentedTest.java: -------------------------------------------------------------------------------- 1 | package org.wangchenlong.constraintlayoutdemo; 2 | 3 | import android.content.Context; 4 | import android.support.test.InstrumentationRegistry; 5 | import android.support.test.runner.AndroidJUnit4; 6 | 7 | import org.junit.Test; 8 | import org.junit.runner.RunWith; 9 | 10 | import static org.junit.Assert.*; 11 | 12 | /** 13 | * Instrumentation test, which will execute on an Android device. 14 | * 15 | * @see Testing documentation 16 | */ 17 | @RunWith(AndroidJUnit4.class) 18 | public class ExampleInstrumentedTest { 19 | @Test 20 | public void useAppContext() throws Exception { 21 | // Context of the app under test. 22 | Context appContext = InstrumentationRegistry.getTargetContext(); 23 | 24 | assertEquals("org.wangchenlong.constraintlayoutdemo", appContext.getPackageName()); 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /app/src/main/AndroidManifest.xml: -------------------------------------------------------------------------------- 1 | 2 | 4 | 5 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 22 | 23 | 24 | -------------------------------------------------------------------------------- /app/src/main/java/org/wangchenlong/constraintlayoutdemo/LayoutDisplayActivity.java: -------------------------------------------------------------------------------- 1 | package org.wangchenlong.constraintlayoutdemo; 2 | 3 | import android.content.Intent; 4 | import android.os.Bundle; 5 | import android.support.annotation.Nullable; 6 | import android.support.v7.app.AppCompatActivity; 7 | 8 | /** 9 | * 显示Layout的页面, 复用多个布局Id 10 | *

11 | * Created by wangchenlong on 16/7/25. 12 | */ 13 | public class LayoutDisplayActivity extends AppCompatActivity { 14 | private static final String TAG = LayoutDisplayActivity.class.getSimpleName(); 15 | static final String EXTRA_LAYOUT_ID = TAG + ".layoutId"; // 布局ID 16 | 17 | @Override protected void onCreate(@Nullable Bundle savedInstanceState) { 18 | super.onCreate(savedInstanceState); 19 | setTitle(getIntent().getStringExtra(Intent.EXTRA_TITLE)); 20 | final int layoutId = getIntent().getIntExtra(EXTRA_LAYOUT_ID, 0); 21 | setContentView(layoutId); // 设置页面布局, 复用布局 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /app/src/main/java/org/wangchenlong/constraintlayoutdemo/MainActivity.java: -------------------------------------------------------------------------------- 1 | package org.wangchenlong.constraintlayoutdemo; 2 | 3 | import android.content.Intent; 4 | import android.support.v7.app.AppCompatActivity; 5 | import android.os.Bundle; 6 | import android.view.View; 7 | import android.widget.AdapterView; 8 | import android.widget.ArrayAdapter; 9 | import android.widget.ListView; 10 | 11 | public class MainActivity extends AppCompatActivity { 12 | 13 | // 项名称 14 | private static final String[] LIST_ITEMS = { 15 | "Base", 16 | "Bias", 17 | "Guide Line", 18 | "Measure", 19 | "Aspect Ratio" 20 | }; 21 | 22 | // 项布局Id 23 | private static final int[] LAYOUT_IDS = { 24 | R.layout.layout_base, 25 | R.layout.layout_bias, 26 | R.layout.layout_guide_line, 27 | R.layout.layout_measure, 28 | R.layout.layout_aspect_ratio 29 | }; 30 | 31 | @Override 32 | protected void onCreate(Bundle savedInstanceState) { 33 | super.onCreate(savedInstanceState); 34 | setContentView(R.layout.activity_main); // 布局 35 | 36 | ListView list = (ListView) findViewById(R.id.activity_main); // 列表控件 37 | ArrayAdapter adapter = 38 | new ArrayAdapter<>(this, android.R.layout.simple_list_item_1, LIST_ITEMS); 39 | list.setAdapter(adapter); 40 | list.setOnItemClickListener(new AdapterView.OnItemClickListener() { 41 | @Override 42 | public void onItemClick(AdapterView adapterView, View view, int i, long l) { 43 | // 复用页面，显示不同的布局样式 44 | Intent intent = new Intent(MainActivity.this, LayoutDisplayActivity.class); 45 | intent.putExtra(Intent.EXTRA_TITLE, LIST_ITEMS[i]); // 标题 46 | intent.putExtra(LayoutDisplayActivity.EXTRA_LAYOUT_ID, LAYOUT_IDS[i]); // 布局Id 47 | startActivity(intent); 48 | } 49 | }); 50 | } 51 | } 52 | -------------------------------------------------------------------------------- /app/src/main/res/drawable/total_large.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SpikeKing/ConstraintLayoutDemo/18d277a1be1e2e70833b74ca7c5d3b1cf442b28e/app/src/main/res/drawable/total_large.jpg -------------------------------------------------------------------------------- /app/src/main/res/layout/activity_main.xml: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /app/src/main/res/layout/layout_aspect_ratio.xml: -------------------------------------------------------------------------------- 1 | 2 | 8 | 9 | 18 | 19 | 29 | 30 | -------------------------------------------------------------------------------- /app/src/main/res/layout/layout_base.xml: -------------------------------------------------------------------------------- 1 | 2 | 8 | 9 |