Nền tảng Gradient tuyến tính của Android

Tôi gặp sự cố khi áp dụng nền gradient cho linearLayout.

Điều này tương đối đơn giản so với những gì tôi đã đọc nhưng dường như nó không hoạt động. Đối với các tài liệu tham khảo tôi đang phát triển trên 2.1-update1.

tiêu đề_bg.xml:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <gradient
        android:angle="90"
        android:startColor="#FFFF0000"
        android:endColor="#FF00FF00"
        android:type="linear"/>
</shape>

main_header.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="50dip"
    android:orientation="horizontal"
    android:background="@drawable/header_bg">
</LinearLayout>

Nếu tôi thay đổi @ drawable / header_bg thành màu - ví dụ # FF0000 thì nó hoạt động hoàn toàn tốt. Tôi có thiếu một cái gì đó rõ ràng ở đây?

Ok tôi đã quản lý để giải quyết điều này bằng cách sử dụng một bộ chọn. Xem mã dưới đây:

main_header.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="50dip"
    android:orientation="horizontal"
    android:background="@drawable/main_header_selector">
</LinearLayout>

main_header_selector.xml:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
    <shape>
        <gradient
            android:angle="90"
            android:startColor="#FFFF0000"
            android:endColor="#FF00FF00"
            android:type="linear" />
    </shape>
</item>
</selector>

Hy vọng điều này sẽ giúp những người có cùng vấn đề.

Cũng có thể có màu thứ ba (giữa). Và các loại hình dạng khác nhau.

Ví dụ: trong drawable / gradient.xml:

<shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <gradient
        android:startColor="#000000"
        android:centerColor="#5b5b5b"
        android:endColor="#000000"
        android:angle="0" />
</shape>

Điều này cung cấp cho bạn màu đen - xám - đen (trái sang phải), đó là atm nền tối yêu thích của tôi.

Hãy nhớ thêm gradient.xml làm nền trong bố cục xml của bạn:

android:background="@drawable/gradient"

Cũng có thể xoay, với:

góc = "0"

cung cấp cho bạn một đường thẳng đứng

và với

góc = "90"

cung cấp cho bạn một đường ngang

Các góc có thể là:

0, 90, 180, 270.

Ngoài ra có một vài loại hình dạng khác nhau:

android: shape = "hình chữ nhật"

Hình tròn:

android: hình dạng = "hình bầu dục"

và đáng ngạc nhiên là một vài nữa

Hy vọng nó sẽ giúp, chúc mừng!

Trong tệp XML có thể vẽ:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape>
            <gradient android:angle="90"
                android:endColor="#9b0493"
                android:startColor="#38068f"
                android:type="linear" />
        </shape>
    </item>
</selector>

Trong tệp bố cục của bạn: android: background = "@ drawable / gradient_background"

  <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@drawable/gradient_background"
        android:orientation="vertical"
        android:padding="20dp">
        .....

</LinearLayout>

Hãy thử xóa Android: gradientRadius = "90". Đây là một trong những hoạt động cho tôi:

<shape 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle"
>
    <gradient
        android:startColor="@color/purple"
        android:endColor="@color/pink"
        android:angle="270" />
</shape>

Vấn đề của tôi là phần mở rộng .xml không được thêm vào tên tệp của tệp XML mới được tạo. Thêm phần mở rộng .xml đã khắc phục sự cố của tôi.

Với Kotlin bạn có thể làm điều đó chỉ trong 2 dòng

Thay đổi giá trị màu trong mảng

                  val gradientDrawable = GradientDrawable(
                        GradientDrawable.Orientation.TOP_BOTTOM,
                        intArrayOf(Color.parseColor("#008000"),
                                   Color.parseColor("#ADFF2F"))
                    );
                    gradientDrawable.cornerRadius = 0f;

                   //Set Gradient
                   linearLayout.setBackground(gradientDrawable);

Kết quả

Tôi không biết điều này có giúp được ai không, nhưng vấn đề của tôi là tôi đã cố gắng đặt độ dốc thành thuộc tính "src" của ImageView như vậy:

<ImageView 
    android:id="@+id/imgToast"
    android:layout_width="wrap_content"
    android:layout_height="60dp"
    android:src="@drawable/toast_bg"
    android:adjustViewBounds="true"
    android:scaleType="fitXY"/>

Không chắc chắn 100% lý do tại sao điều đó không hoạt động, nhưng bây giờ tôi đã thay đổi nó và đặt drawable trong thuộc tính "nền" của cha mẹ ImageView, đó là RelativeLayout trong trường hợp của tôi, như vậy: (điều này đã hoạt động thành công)

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:id="@+id/custom_toast_layout_id"
    android:layout_height="match_parent"
    android:background="@drawable/toast_bg">

Tôi sẽ kiểm tra kênh alpha của bạn trên màu gradient của bạn. Đối với tôi, khi tôi đang kiểm tra mã của mình, tôi đã đặt kênh alpha sai về màu sắc và nó không hoạt động với tôi. Khi tôi nhận được kênh alpha, tất cả đều hoạt động!

Bạn có thể sử dụng một chế độ xem tùy chỉnh để làm điều đó. Với giải pháp này, nó đã hoàn thành các hình dạng gradient của tất cả các màu trong các dự án của bạn:

class GradientView(context: Context, attrs: AttributeSet) : View(context, attrs) {

    // Properties
    private val paint: Paint = Paint()
    private val rect = Rect()

    //region Attributes
    var start: Int = Color.WHITE
    var end: Int = Color.WHITE
    //endregion

    override fun onSizeChanged(w: Int, h: Int, oldw: Int, oldh: Int) {
        super.onSizeChanged(w, h, oldw, oldh)
        // Update Size
        val usableWidth = width - (paddingLeft + paddingRight)
        val usableHeight = height - (paddingTop + paddingBottom)
        rect.right = usableWidth
        rect.bottom = usableHeight
        // Update Color
        paint.shader = LinearGradient(0f, 0f, width.toFloat(), 0f,
                start, end, Shader.TileMode.CLAMP)
        // ReDraw
        invalidate()
    }

    override fun onDraw(canvas: Canvas) {
        super.onDraw(canvas)
        canvas.drawRect(rect, paint)
    }

}

Tôi cũng tạo một GradientView dự án nguồn mở với chế độ xem tùy chỉnh này:

https://github.com/lopspower/GradientView

implementation 'com.mikhaellopez:gradientview:1.1.0'