ساخت پترن و اعمال opacity در اندروید با کاتلین ، سایت فلت ایکن (Flat icon) رو همگی میشناسیم (حداقل دیزاینر ها و پروگرمر ها 🙂 )
یکی از قابلیت هایی که این سایت واقعا خوب بهتون میده اینکه میتونید پترن شخصی خودتون رو بسازید که این فوق العاده ست !!
همچنین بخوانید: سورس اندروید اسلایدر پیشرفته با کاتلین
توی این پست میخوایم یک پترن طراحی کنیم و داخل اندروید بهش opacity بدیم !
خب اندروید مثل طراحی وب سایت پراپرتی بنام opacity نداره (میتونید سرچ کنید 🙂 )
اما ما میتونیم یه opacity دستی بسازیم
پس بریم ادامه پست 😀
خب ابتدا من پترن زیر رو ایجاد کردم
پترن ایجاد شده رومیتونیم به چندین فرمت دانلود کنیم
من svg رو دانلود میکنم و تبدیل به وکتور میکنم و توی اندروید استفاده میکنم
با استفاده از این سایت یا حتی داخل خود اندروید میشه این تبدیل رو انجام داد
حالا بریم سراغ opacity دادن به عکس
ابتدا لایه رو بدین صورت طراحی میکنیم
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".OpacityAcitivity">
<ImageView
android:id="@+id/imageView"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="@drawable/pattern" />
</android.support.constraint.ConstraintLayout>
بعد یک فایل xml میسازیم که در واقع همون لایه opacity ما میشه که میتونیم بندازیمش رو هر عکسی و به اون کمی opacity بدیم
فایل opacity بدین صورت خواهد بود
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<solid android:color="#A4FFFFFF" />
</shape>
و در نهایت فایل xml بدین صورت خواهد بود
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".OpacityAcitivity">
<ImageView
android:id="@+id/imageView"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="@drawable/pattern" />
<ImageView
android:id="@+id/imageView2"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="@drawable/ic_opacity" />
</android.support.constraint.ConstraintLayout>
و نتیجه بدین صورت خواهد شد
همچنین بخوانید: آموزش گرفتن اسکرین شات با کاتلین در اندروید + سورس کد