如何使用约束布局分割两种背景颜色?

时间:2017-11-09 02:50:00

标签: android xml android-constraintlayout

我想使用上面的蓝色背景分割两个背景,底部保持白色。使用约束布局,可以轻松制作水平指南。但是,当我试图分割两种背景颜色时,我会陷入困境。

$ crystal -v
Crystal 0.23.1 (2017-10-12) LLVM 4.0.1
$ crystal build test.cr && ./test | head -3
01 foo bar baz qux foo bar baz qux foo bar baz qux foo bar baz qux foo bar baz qux
02
$ ruby test.cr | head -3
01 foo bar baz qux foo bar baz qux foo bar baz qux foo bar baz qux foo bar baz qux
02 foo bar baz qux foo bar baz qux foo bar baz qux foo bar baz qux foo bar baz qux
03 foo bar baz qux foo bar baz qux foo bar baz qux foo bar baz qux foo bar baz qux

感谢任何评论或建议。谢谢。

Task view

2 个答案:

答案 0 :(得分:1)

您可以根据指南声明两种不同背景颜色的视图,以实现这一目标。

<?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"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.constraint.Guideline
        android:id="@+id/guideline10"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0.2" />

    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:background="@color/colorPrimary"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toTopOf="@+id/guideline10"/>

    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:background="@color/colorAccent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/guideline10"/>

</android.support.constraint.ConstraintLayout>

答案 1 :(得分:0)

对于背景颜色,如顶部蓝色和底部白色使用渐变可绘制。

<?xml version="1.0" encoding="utf-8"?>

<gradient
    android:angle="270"
    android:startColor="@color/colorPrimary"
    android:endColor="@android:color/white"/>

并将此文件设置为约束布局的背景..

<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="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/background_gradient"
    tools:context="com.mycamera.Sample">

    <android.support.constraint.Guideline
        android:id="@+id/guideline10"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0.2" />

</android.support.constraint.ConstraintLayout>