tejariapp-new-logotejariapp-new-logotejariapp-new-logotejariapp-new-logo
  • صفحه اصلی
  • پروژه ها
    • پروژه طراحی سایت
    • پروژه های اندروید
    • پروژه های تحت ویندوز
    • UI & UX
    • ربات تلگرام
  • سفارش پروژه
    • انجام پروژه اندروید (Android)
    • طراحی و ساخت اپلیکیشن موبایل
    • انجام پروژه طراحی سایت با php
    • انجام پروژه طراحی سایت با Asp.net
    • انجام پروژه سی شارپ
    • فرم سفارش پروژه
  • مدرسه ی تجاری اپ
    • طراحی سایت
    • اندروید
    • سی شارپ
    • آموزش پایگاه داده
    • برنامه های کاربردی
  • لینک های مفید
    • پرداخت آنلاین
    • درباره تجاری اپ
    • تماس با ما
استخدام برنامه نویس متلب
سفارش پروژه
✕
            هیچ نتیجه ای یافت نشدمشاهده همه نتایج

            آموزش Expandable RecyclerView در اندروید با کاتلین

            • صفحه نخست
            • مدرسه ی تجاری اپ آموزش اندروید
            • آموزش Expandable RecyclerView در اندروید با کاتلین
            رابط کاربری اپلیکیشن موزیک پلیر برای ios با Adobe XD
            رابط کاربری UI اپلیکیشن موزیک پلیر برای ios با Adobe XD
            13 دی 1397
            نمودار دایره ای در اندروید
            رسم نمودار دایره ای pie chart در اندروید با کاتلین
            19 دی 1397
            منتشر شده توسط مهندس داودی
            آموزش Expandable RecyclerView در اندروید

            آموزش Expandable RecyclerView در اندروید

            آموزش Expandable RecyclerView در اندروید با کاتلین ، در این پست آموزشی ما یکی از پرکاربردترین ابزارهای اندروید یعنی RecyclerView رو داریم که میخوایم اون رو بصورت Expandable یا قابل گسترش دربیاریم !

            آموزش Expandable RecyclerView در اندروید با کاتلین

            کتابخونه هایی هستند که این کا ررو برای ما انجام میدن اما خب چکاریه زمانی که میتونیم خودمون اون رو پیاده و ایجاد کنیم بریم و کتایخونه ای به پروژه ایمپورت کنیم که حجم رو بالا میبره و هم ممکنه مشکلات دیگری از قبیل تداخب کتابخونه ها برامون بوجود بیاره(البته این مشکلات در خیلی استفاده از خیلی از کتابخانه ها بوجود نمیاد اما همیشه پیشگیری بهتر از درمانه 😀  ).

            نتیجه آموزش زیر بصورت زیر خواهد بود (برای مشاهده گیف پایین روی اون کلیک کنید :)‌  )

            آموزش Expandable RecyclerView در اندروید با کاتلین

            آموزش Expandable RecyclerView در اندروید با کاتلین

            ما تو این آموزش لیست قابل گسترش یا Expandable رو با کاستومایز کردن اداپتر و دیتا مدل مربوط به آیتم های لیست بصورت زیر ایجاد میکنیم.

            خب بریم سراغ کدزدن 😉

            اولین کاری که باید انجام بدیم این است که یک کلاس مدل برای دیتاهایی که میخوایم داخل لیست نمایش بدیم ایجاد کنیم که در کاتلین با کلمه کلیدی data model ایجاد میشه

            نکته جالب درباره کلاس های کاتلین این است که دیگه خبری از getter , setter ها (یا اصطلاحا boilerplate code ها ) نیست بلکه کافیه از خود پراپرتی ها استفاده کنیم و فقط درصورتی که مثلا بخواهیم ادیتی در getter دهیم آنرا ایجاد میکنیم.

            package dn.marjan.bosscompanysample
            
            data class Users(var id: Int,var name: String,var family: String 
                             , var age: Int,var city: String ,var isSubFalg: Boolean)
            

            فایل colors.xml نیز بصورت زیر است

            <?xml version="1.0" encoding="utf-8"?>
            <resources>
                <color name="colorPrimary">#801515</color>
                <color name="colorPrimaryDark">#550000</color>
                <color name="colorAccent">#D46A6A</color>
                <color name="white">#ffffff</color>
            </resources>
            

            من یک فایل استایل برا ردیوس دار کردن کانسترینت لیوت آیتم لیست نیز ایجاد کردم که بصورت زیر هستش

            <?xml version="1.0" encoding="UTF-8"?>
            <shape xmlns:android="http://schemas.android.com/apk/res/android">
                <!--<solid android:color="#FFFFFF"/>-->
                <!--<stroke android:width="3dp" android:color="#B1BCBE" />-->
                <corners android:radius="10dp"/>
                <padding android:left="0dp" android:top="0dp" android:right="0dp" android:bottom="0dp" />
            </shape>
            

            در ادامه این فایل را با پراپرتی background به کانسرینت لیوت اختصاص دادم.

            حالا لایه اصلی برنامه را یپاده میکنیم که تنها یک RecyclerView را درخود جای داده

            <?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"
                >
            
                <android.support.v4.widget.NestedScrollView
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:fillViewport="true">
            
                    <android.support.constraint.ConstraintLayout
                        android:layout_width="match_parent"
                        android:layout_height="match_parent">
            
            
                        <android.support.v7.widget.RecyclerView
                            android:id="@+id/rcv_pms"
                            android:layout_width="match_parent"
                            android:layout_height="0dp"
                            android:layout_marginTop="8dp"
                            app:layout_constraintBottom_toBottomOf="parent"
                            app:layout_constraintEnd_toEndOf="parent"
                            app:layout_constraintStart_toStartOf="parent"
                            app:layout_constraintTop_toTopOf="parent" />
                    </android.support.constraint.ConstraintLayout>
            
                </android.support.v4.widget.NestedScrollView>
            
            
            </android.support.constraint.ConstraintLayout>
            

            و درادامه لایه آیتم های لیست را نیز پیاده میکنیم که براساس کلاس دیتا مدل هر تعداد تکست ویو یا هر آبجکت دیگر به آن اضافه میکنیم

            ما در این لایه دو  ConstraintLayout داخلی و یک ConstraintLayout روت داریم که آن دو کانسترینت داخلی اهداف ما هستند و در اداپتر با آنها سروکار داریم.

            بدین صورت که یکی از آنها که نام layout_sub_header بطور پیشفرض نمایش داده نمیشود بلکه زمانی که کاربر روی کانسترینت با نام layout_header کلیک کرد ، آن لایه نمایش داده میشود که این روند در اداپتر با استفاده از فیلد isSubFlag انجام میپذیرد (در ادامه خواهیم دید)

            <?xml version="1.0" encoding="utf-8"?>
            <android.support.v7.widget.CardView 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="wrap_content"
                android:layout_margin="10dp"
                app:cardCornerRadius="15dp">
            
                <android.support.constraint.ConstraintLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="@drawable/radios_style"
                    >
            
                    <android.support.constraint.ConstraintLayout
                        android:id="@+id/layout_header"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:background="@color/colorAccent"
                        app:layout_constraintEnd_toEndOf="parent"
                        app:layout_constraintStart_toStartOf="parent"
                        app:layout_constraintTop_toTopOf="parent">
            
                        <TextView
                            android:id="@+id/textView8"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_marginStart="16dp"
                            android:layout_marginLeft="16dp"
                            android:layout_marginTop="16dp"
                            android:layout_marginEnd="16dp"
                            android:layout_marginRight="16dp"
                            android:text="شناسه :‌"
                            android:textColor="@color/white"
                            app:layout_constraintEnd_toEndOf="parent"
                            app:layout_constraintHorizontal_bias="0.5"
                            app:layout_constraintStart_toEndOf="@+id/txv_id"
                            app:layout_constraintTop_toTopOf="parent" />
            
                        <TextView
                            android:id="@+id/txv_id"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:text="TextView"
                            android:textColor="@color/white"
                            app:layout_constraintBottom_toBottomOf="@+id/textView8"
                            app:layout_constraintEnd_toStartOf="@+id/textView8"
                            app:layout_constraintHorizontal_bias="1.0"
                            app:layout_constraintHorizontal_chainStyle="packed"
                            app:layout_constraintStart_toStartOf="parent"
                            app:layout_constraintTop_toTopOf="@+id/textView8" />
            
                        <TextView
                            android:id="@+id/textView10"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_marginStart="16dp"
                            android:layout_marginLeft="16dp"
                            android:layout_marginTop="16dp"
                            android:layout_marginEnd="16dp"
                            android:layout_marginRight="16dp"
                            android:text="نام :"
                            android:textColor="@color/white"
                            app:layout_constraintEnd_toEndOf="parent"
                            app:layout_constraintHorizontal_bias="0.5"
                            app:layout_constraintStart_toEndOf="@+id/txv_name"
                            app:layout_constraintTop_toBottomOf="@+id/textView8" />
            
                        <TextView
                            android:id="@+id/txv_name"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:text="TextView"
                            android:textColor="@color/white"
                            app:layout_constraintBottom_toBottomOf="@+id/textView10"
                            app:layout_constraintEnd_toStartOf="@+id/textView10"
                            app:layout_constraintHorizontal_bias="1.0"
                            app:layout_constraintHorizontal_chainStyle="packed"
                            app:layout_constraintStart_toStartOf="parent"
                            app:layout_constraintTop_toTopOf="@+id/textView10" />
            
                        <TextView
                            android:id="@+id/textView12"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_marginStart="16dp"
                            android:layout_marginLeft="16dp"
                            android:layout_marginTop="16dp"
                            android:layout_marginEnd="16dp"
                            android:layout_marginRight="16dp"
                            android:layout_marginBottom="16dp"
                            android:text="نام خانوادگی :"
                            android:textColor="@color/white"
                            app:layout_constraintBottom_toBottomOf="parent"
                            app:layout_constraintEnd_toEndOf="parent"
                            app:layout_constraintHorizontal_bias="0.5"
                            app:layout_constraintStart_toEndOf="@+id/txv_family"
                            app:layout_constraintTop_toBottomOf="@+id/textView10" />
            
                        <TextView
                            android:id="@+id/txv_family"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:text="TextView"
                            android:textColor="@color/white"
                            app:layout_constraintBottom_toBottomOf="@+id/textView12"
                            app:layout_constraintEnd_toStartOf="@+id/textView12"
                            app:layout_constraintHorizontal_bias="1.0"
                            app:layout_constraintHorizontal_chainStyle="packed"
                            app:layout_constraintStart_toStartOf="parent"
                            app:layout_constraintTop_toTopOf="@+id/textView12" />
            
                    </android.support.constraint.ConstraintLayout>
            
                    <android.support.constraint.ConstraintLayout
                        android:id="@+id/layout_sub_header"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_marginBottom="13dp"
                        android:visibility="visible"
                        app:layout_constraintBottom_toBottomOf="parent"
                        app:layout_constraintEnd_toEndOf="parent"
                        app:layout_constraintStart_toStartOf="parent"
                        app:layout_constraintTop_toBottomOf="@+id/layout_header"
                        app:layout_constraintVertical_bias="0.0">
            
                        <TextView
                            android:id="@+id/textView16"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_marginStart="16dp"
                            android:layout_marginLeft="16dp"
                            android:layout_marginTop="16dp"
                            android:layout_marginEnd="16dp"
                            android:layout_marginRight="16dp"
                            android:text="سن :"
                            app:layout_constraintEnd_toEndOf="parent"
                            app:layout_constraintHorizontal_bias="0.5"
                            app:layout_constraintStart_toEndOf="@+id/txv_age"
                            app:layout_constraintTop_toTopOf="parent" />
            
                        <TextView
                            android:id="@+id/txv_age"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:text="TextView"
                            app:layout_constraintBottom_toBottomOf="@+id/textView16"
                            app:layout_constraintEnd_toStartOf="@+id/textView16"
                            app:layout_constraintHorizontal_bias="1.0"
                            app:layout_constraintHorizontal_chainStyle="packed"
                            app:layout_constraintStart_toStartOf="parent"
                            app:layout_constraintTop_toTopOf="@+id/textView16" />
            
                        <TextView
                            android:id="@+id/textView20"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_marginStart="16dp"
                            android:layout_marginLeft="16dp"
                            android:layout_marginTop="16dp"
                            android:layout_marginEnd="16dp"
                            android:layout_marginRight="16dp"
                            android:layout_marginBottom="8dp"
                            android:text="شهر :"
                            app:layout_constraintBottom_toBottomOf="parent"
                            app:layout_constraintEnd_toEndOf="parent"
                            app:layout_constraintHorizontal_bias="0.5"
                            app:layout_constraintStart_toEndOf="@+id/txv_city"
                            app:layout_constraintTop_toBottomOf="@+id/textView16" />
            
                        <TextView
                            android:id="@+id/txv_city"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:text="TextView"
                            app:layout_constraintBottom_toBottomOf="@+id/textView20"
                            app:layout_constraintEnd_toStartOf="@+id/textView20"
                            app:layout_constraintHorizontal_bias="1.0"
                            app:layout_constraintHorizontal_chainStyle="packed"
                            app:layout_constraintStart_toStartOf="parent"
                            app:layout_constraintTop_toTopOf="@+id/textView20" />
            
                    </android.support.constraint.ConstraintLayout>
                </android.support.constraint.ConstraintLayout>
            </android.support.v7.widget.CardView>
            

             

            حالا فقط کافیه که کلاس اداپتر مربوط به ریسایکلرویو رو بسازیم

            نکته خیلی مهم در این کلاس استفاه از متغیر isSubFlag دیتامدل هست که ما دراداپتر براساس این  متغیر تصمیم میگیریم که یک آیتم کلیک شده(لایه layout_sub_header باز شده) یا خیر که پیشفرض برای تمام آیتم ها False به معنی بسته خواهد بود

             

            package dn.marjan.bosscompanysample
            
            import android.support.v7.widget.RecyclerView
            import android.view.LayoutInflater
            import android.view.View
            import android.view.ViewGroup
            import kotlinx.android.synthetic.main.item_user.view.*
            
            class UsersAdapter(val usersList: ArrayList<Users>): RecyclerView.Adapter<UsersAdapter.MyViewHolder>() {
            
                override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): MyViewHolder {
                    val view = LayoutInflater.from(parent.context)
                            .inflate(R.layout.item_user,parent,false)
                    return MyViewHolder(view)
                }
            
                override fun getItemCount(): Int = usersList.size
            
                override fun onBindViewHolder(holder: MyViewHolder, position: Int) {
                    val  user = usersList[position]
            
                    holder.setItems(user)
            
                    //decide that sub item should show or hidden
                    if (user.isSubFalg)
                        holder.itemView.layout_header.visibility = View.VISIBLE
                    else
                        holder.itemView.layout_sub_header.visibility =View.GONE
            
                    //when click on item to show or hidden sub item
                    holder.view.layout_header.setOnClickListener {
                        if (user.isSubFalg){
                            holder.itemView.layout_sub_header.visibility = View.GONE
                            user.isSubFalg = false
                        }else{
                            holder.itemView.layout_sub_header.visibility =View.VISIBLE
                            user.isSubFalg = true
                        }
                    }
                }
            
                class MyViewHolder(val view: View): RecyclerView.ViewHolder(view) {
                    fun setItems(user: Users) {
                        view.txv_age.text = user.age.toString()
                        view.txv_name.text = user.name
                        view.txv_family.text = user.family
                        view.txv_id.text = user.id.toString()
                        view.txv_city.text = user.city
                    }
            
                }
            
            }
            

            و در انتها نیزفقط کلاس اکتیویتی اصلی مونده که در اون فقط آرایه ای برای نمایش در لیست ایجاد و مقدار دهی میکنیم

             

            package dn.marjan.bosscompanysample
            
            import android.support.v7.app.AppCompatActivity
            import android.os.Bundle
            import android.support.v7.widget.LinearLayoutManager
            import kotlinx.android.synthetic.main.layout_base.*
            
            class BaseActivity : AppCompatActivity() {
            
                override fun onCreate(savedInstanceState: Bundle?) {
                    super.onCreate(savedInstanceState)
                    setContentView(R.layout.layout_base)
            
                    rcv_pms.layoutManager = LinearLayoutManager(this)
            
                    setData()
                }
            
                private fun setData() {
                    val list = ArrayList<Users>()
                    list.add(Users(1, "ali", "asadi", 32, "shiraz",false))
                    list.add(Users(1, "reza", "shahedi", 12, "esfahan",false))
                    list.add(Users(1, "saeed", "hamedi", 24, "tehran",false))
                    list.add(Users(1, "hamid", "jolan", 33, "tabriz",false))
                    list.add(Users(1, "kave", "javadi", 32, "yaz",false))
                    list.add(Users(1, "javad", "saeed", 21, "gilan",false))
                    list.add(Users(1, "kian", "ilani", 22, "zanjan",false))
            
                    val adapter = UsersAdapter(list)
                    rcv_pms.adapter = adapter
                }
            }
            

            در انتها برنامه رو ران کنید وبا کلیک روی هرآیتم (layout_header) خواهید دید لایه زیرین آن (layout_sub_header) باز خواهد شد.

             

            امیدوارم این پست براتون مفید بوده باشه و ازش استفاده کنید. از طریق راه های ارتباطی زیر میتونید با ما برای درخواست آموزش های اختصاصی و انواع پروژه ها در ارتباط باشید.

            ثبت سفارش پروژه
             
            ثبت سفارش فیلم آموزشی

             

            اشتراک گذاری

            پست های مرتبط

            دستورات جریان کنترل (Control flow statements) یا دستورات شرطی و حلقه ها در زبان برنامه نویسی دارت Dart

            دستورات جریان کنترل (Control flow statements) یا دستورات شرطی و حلقه ها در زبان برنامه نویسی دارت Dart

            30 بهمن 1400

            دستورات شرطی و حلقه ها در زبان برنامه نویسی دارت (Dart)


            ادامه مطلب
            آموزش عملگرها یا Operator ها در زبان برنامه نویسی دارت یا Dart

            آموزش عملگرها یا Operator ها در زبان برنامه نویسی دارت یا Dart

            30 بهمن 1400

            آموزش عملگرها یا Operator ها در زبان برنامه نویسی دارت (Dart)


            ادامه مطلب
            توابع در زبان برنامه نویسی دارت (Dart)

            توابع در زبان برنامه نویسی دارت (Dart)

            27 بهمن 1400

            توابع در زبان برنامه نویسی دارت (Dart)


            ادامه مطلب

            دیدگاهتان را بنویسید لغو پاسخ

            نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

            ساخت اپلیکیشن های موبایل

            • ساخت اپلیکیشن فروشگاهی
            • ساخت اپلیکشن ابزاری و خدماتی
            • ساخت اپلیکیشن آموزشی
            • و هزاران موضوع دیگر

             
            کلیک کنید

            آخرین دیدگاه ها

            • 7 خرداد 1401

              داودی نظر در آموزش استفاده از ckeditor همراه با آپلود عکس در لاراول 6

            • 6 فروردین 1401

              yasaman نظر در راست چین کردن متن در فیگما Figma

            • 3 فروردین 1401

              رضا نظر در مفاهیم Observable و Observer در RxJava

            تجاری اپ در شبکه های اجتماعی

            لوگوی تایید پرداخت آنلاین

            2015-2022 © تمامي حقوق مادي و معنوي اين وب سايت نزد تجاری اپ محفوظ بوده و هر گونه کپي برداري از مطالب پيگرد قانوني به همراه دارد! | طراح سایت : ProgRun
            سفارش پروژه
                      هیچ نتیجه ای یافت نشدمشاهده همه نتایج