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

            آموزش صفر تا صد کار با Navigation Editor

            • صفحه نخست
            • مدرسه ی تجاری اپ آموزش اندروید
            • آموزش صفر تا صد کار با Navigation Editor
            سیر تا پیاز خانواده android jetpack
            سیر تا پیاز خانواده Android Jetpack
            4 بهمن 1397
            سورس اندروید اسلایدر پیشرفته با کاتلین
            سورس اندروید اسلایدر پیشرفته با کاتلین
            10 بهمن 1397
            منتشر شده توسط مهندس داودی
            آموزش صفر تا صد کار با Navigation Editor

            آموزش صفر تا صد کار با Navigation Editor

            آموزش صفر تا صد Navigation Architecture Component در اندروید استودیو ، همه چیز در مورد کار با Navigation Editor ، آموزش Navigation Component در اندروید استودیو ، همه ی این ها می تونن عنوان این آموزش باشن ، Navigation Architecture Component باز هم افتخاری دیگر از خانواده Android Jetpack ! (به طور کامل درباره خانواده Jetpack در این پست های قبلی توضیح داده ایم و پیشنهاد میشود حتمااا مطالعه کنید و لذت ببرید از قدرت گوگل و اندرویدش  😀 )

             

            آموزش کار با Navigation Editor

             

            برای مشاهده تصاویر در سایز واقعی برروی آنها کلیک کنید 🙂

             

            آموزش صفر تا صد Navigation Architecture Component

            با Navigation Editor شما قادر خواهید بود که شمای کلی اپ خود را از جابجایی بین اکتیویتی ها و حتی خیلی جزئی تر -> فرگمنت ها مشخص کنید ! همچینین میتوانید هرنوع دیتایی که میخواید (بصورت Bundle) در این جابجایی برای انتقال مشخص کنید تا همراه با جابجایی این دیتاها نیز منتقل شوند و در مقصد آنها را دریافت کنید.

            آموزش صفر تا صد Navigation Architecture Component

            آموزش صفر تا صد Navigation Architecture Component

            علاوه بر اون قابلیت دیگه ای مثل deeplink نیز هستش که خیلی راحت میتونیم برای هر اکتیویتی در نویگیشن ادیتور مشخص کنیم .
            این مولفه بشدت دوست داشتنی از اندروید استودیو ۳ ارائه شد.
            در این آموزش من از

            android studio => 3.3

            kotlin => 1.3.20

            gradle => 3.3.0

            compileSdkVersion => 28

            targetSdkVersion => 28

            navigation dependency => 1.0.0-alpha11

            استفاده میکنم.

            خب بی درنگ بریم سراغ شروع پروژه Navigation Editor ! 🙂

            اولین مرحله اینکه وابستگی های نویگیشن ادیتور رو به گردل اضافه کنیم

            
            implementation "android.arch.navigation:navigation-fragment:1.0.0-alpha09"
            implementation "android.arch.navigation:navigation-ui:1.0.0-alpha09"
            
            

            یه نکته خیلی مهم اینکه اگر مثل من دارید کاتلین کد میزنید بهتره که به این وابستگی ها یه -ktx اضافه کنید بمنظور اضافه شدن کدهای ساده و مختصر تر برای کاتلین (برای اطلاعات بیشتر حتما به این پست که کاملا توضیح داده شده برید و مطالعه کنید:) )
            پس این وابستگی ها به این صورت تغییر میکنن

            
            implementation "android.arch.navigation:navigation-fragment-ktx:1.0.0-alpha09"
            implementation "android.arch.navigation:navigation-ui-ktx:1.0.0-alpha09"
            
            

            نکته مهم دیگه اینکه اگر از اندروید استودیو ورژن زیر ۳٫۳ استفاده میکنید حتما به این مسیر برید

            File/Setting/Experimental

             

            و گزینه Enable Navigation Editor رو فعال کنید.

            آموزش Navigation Editor در اندروید استودیو

            آموزش Navigation Editor در اندروید استودیو

            حالا داخل مود اندروید روی دایرکتوری res کلیک راست کنید و گزینه New / Android resourse File رو انتخاب کنید
            و مطابق تصویر زیر اطلاعات رو وارد کنید

            کار با Navigation Editor

            کار با Navigation Editor

            دقت کنید که ما میخوایم navigation کار کنیم پس خود اندروید استودیو هم یه دایرکتوری مجزا براش درنظر گرفته پس حتما اون رو انتخاب کنید.
            صفحه نویگیشن ادیتور ما که الان خیلی باهاش کار داریم بصورت زیر هستش

            آموزش Navigation Editor در اندروید استودیو

            آموزش Navigation Editor در اندروید استودیو

            مشخصا ۳ بخش اصلی داریم که به شرح زیر هستن

            Destinations:

            لیستی از host نویگیشن یا به اصطلاح خانه نویگیشن و مجموعه اهداف فعلی آن در Graph Editor

            Graph Editor:

            شامل نمایی ویژوال از فرگمنت ها و اکتیویتی که بصورت ویژوال با آنها کار خواهیم کرد

            Attributes :

            نمایش خصیصه ها و پراپرتی ها برای آیتم انتخاب شده در Graph Editor

            حالا در قدم اول باید یک هاست یا خانه برای گراف خود ایجاد کنیم که ما میخوایم MainActivity بشه خانه first_nav_graph پس به لایه مربوطه آن یعنی activity_main میریم و در زبانه design در پلت به دنبال NavHostFragment میگردیم

            کار با Navigation Editor

            کار با Navigation Editor

            سپس اون رو درگ میکنیم برروی صفحه میکشیم.
            یک پنجره برامون باز میشه که میخواد مشخص کنه این خانه مربوط به کدم گراف هستش

            آموزش Navigation Editor در اندروید استودیو

            آموزش Navigation Editor در اندروید استودیو

            خب ما گرافی که داریم و میخوام این اکتیویتی خونش بشه رو انتخاب میکنیم.
            و لایه مون به این شکل میشه .

            کار با Navigation Editor

            کار با Navigation Editor

            کدی که ایجاد میشه بدین صورته که یک پراپرتی اون برای ما خیلی مهمه
            پراپرتی app:defaultNavHost که مشخص میکنه دکمه بک گوشی برای این فرگمنت کار کنه یا خیر
            بطور پیشفرض اگر این پراپرتی حذف شود دکمه بک کار نخواهد کرد.

            <fragment
            android:id="@+id/nav_host_fragment"
            android:name="androidx.navigation.fragment.NavHostFragment"
            android:layout_width="395dp"
            android:layout_height="715dp"
            android:layout_marginStart="8dp"
            android:layout_marginLeft="8dp"
            android:layout_marginTop="8dp"
            android:layout_marginEnd="8dp"
            android:layout_marginRight="8dp"
            android:layout_marginBottom="8dp"
            app:defaultNavHost="true"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:navGraph="@navigation/first_nav_graph" />
            
            

            اما برای اطمینان از اینکه این دکمه کار میکند علاوه بر اینکه این پراپرتی را مقدار ture میدهیم در MainActivty هم این دستور را مینویسیم

            override fun onSupportNavigateUp() =
            findNavController(this, R.id.nav_host_fragment).navigateUp()
            
            

            درسته خاکستریه به معنی اینکه محتوی خاصی نداره و ناشناخته ست (اما مطابق چیزی که داخلش نوشته fragment مشخصه که داخلش فقط فرگمنت میتونه باشه) اما در ادامه خواهید دید که این رنگ خاکستری از بین میره و محتوی میگیره 😉

            الان اگر به first_nav_graph برگردیم خواهیم دید که بخش Host در قسمت Destination با لایه activity_main پرشده !

            آموزش Navigation Editor در اندروید استودیو

            آموزش Navigation Editor در اندروید استودیو

            این یعنی این اکتیویتی باموفقیت به عنوان خانه این گراف معرفی شد ! 😀

            حالا بریم ادامه کار ..

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

            کار با Navigation Editor

            کار با Navigation Editor

            و الان میتونیم لیست تمام آیتم هایی (فرگمنت ها و اکتیویتی ها) که میتونیم در گراف استفاده کنیم رو ببینیم که الان آیتم خاصی نداریم !
            اما دو بخش در این پنجره هست که همیشه ثابته یکی آیتم اول که یک هدف یا آیتم رو میسازه Create New Destination و یکی هم placeholder که همونطور که از اسمش مشخصه یک آیتم خالیه فقط برای اینکه بدونیم بعدا یک فرگمنت یا اکیتیوتی جای این آیتم قرار میگیره و باید پرش کنیم !
            پس روی گزینه اول Create New Destination کلیک میکنیم و خواهیم دید پنجره زیر برامون باز میشه

            آموزش Navigation Editor در اندروید استودیو

            آموزش Navigation Editor در اندروید استودیو

            که میگه یک فرگمنت بسازید ما بصورت تصویر فوق اطلاعات رو وارد میکنیم همچنین میگیم که لایه مربوط به فرگمنت هم برامون بساز !
            اما تیک مربوط به گزینه include interface callback رو برداشتم چون فعلا نیازی نیست که یک کالبک برای فرگمنت ایجاد بشه
            بعد از ساخت فرگمنت خواهیم دید که در بخش Graph Editor یک لایه ایجاد میشه که مربوط به همون فرگمنتی هست که ساختیم

            کار با Navigation Editor

            کار با Navigation Editor

            خود آیتم لایه رو نشون میده و نوشته بالای اون اسم فرگمنت مربوطه ش رو نشون میده و یک آیکن خونه هست که در ادامه متوجه میشیم چی هست… !
            و جالب اینکه اگر به لایه activity_main بریم میبینیم که فرگمنتی که ساختیم اومده و داخل nav_host قرار گرفته
            دیدید گفتم رنگ خاکستریش میپره 😀 !!

            خب این به چه معنیه؟؟
            به این معنی که این فرگمنتی که ما ساختیم و عنوان فرگمنت اول(معنی آیکن خانه کنار اسم فرگمنت در Graph Editor) و نقطه شروع این اکتیویتی شناخته شده یا به عبارتی دیگه زمانی که این اکتیویتی روی صفحه موبایل نشون داده میشه درواقع اولین فرگمنتی هست که در اکتیوتی لود میشه !
            این رو میشه از یه جای دیگه هم متوجه شد و حتی ادیتش کرد ! بریم به مود text مربوط به first_nav_graph و در تگ navigation این پراپرتی رو ببینیم

            
            <navigation 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:id="@+id/first_nav_graph"
            app:startDestination="@id/AFirstFragment">
            
            

            در این تگ پراپرتی app:startDestination مدنظر ما هست که نشون دهنده فرگمنت استارتر یا اولین فرگمنتی که در اکتیویتی لود میشه هستش که همونطور که میبینید مقداری که گرفته یک ایدی هستش که در واقع ایدی همون فرگمنتی هست که ما در گراف ایجاد کردیم

            <?xml version="1.0" encoding="utf-8"?>
            <navigation 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:id="@+id/first_nav_graph"
            app:startDestination="@id/AFirstFragment">
            
            <fragment
            android:id="@+id/AFirstFragment"
            android:name="dn.marjan.navigationeditor.AFirstFragment"
            android:label="fragment_a_first"
            tools:layout="@layout/fragment_a_first" />
            </navigation>
            
            

            که این ایدی میتونه به ایدی هر فرگمنتی که به گراف اضافه میکنیم تغییر کنه و هیچ اجباری در اون نیست پس ما میایم و به همین ترتیب یک فرگمنت دیگه میسازیم

            آموزش Navigation Editor در اندروید استودیو

            آموزش Navigation Editor در اندروید استودیو

            و نتیجه در گراف ادیتور بصورت زیر میشه

             

            و اما پراپرتی هایی که برای fragment ایجاد شده به چه معنی هستند ؟!
            android:id : یک شناسه یکتا برای این ویو
            android:name : آدرس دقیق فرگمنت مورد نظر
            android:label : یک عنوان برای فرگمنت
            tools:layout: لایه مرتبط به فرگمنتی که به آن اشاره داریم
            همچنین اگر باز به زبانه design گراف برگردیم و به پنل Attributes نگاهی کنیم میبینیم که همین مشخصات در این بخش هم هست به علاوه یک مشخصه Type که نوع آیتم انتخابی رو مشخص میکنه (اون سه بخش پایین Argumants , Actions , DeepLinks رو فعلا کاری نداریم و در ادامه درباره شون صحبت خواهیم کرد)

            کار با Navigation Editor

            کار با Navigation Editor

            همونطور که میبینید کنار اسم فرگمنت جدید یعنی ASecondFragment آیکن خونه نیست بدین معنی که این فرگمنت تا زمانی که ما فلشی بهش وصل نکنیم جایی نمایش داده نمیشه حتی کدهارو هم ببینیم به این صورت شده

            <?xml version="1.0" encoding="utf-8"?>
            <navigation 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:id="@+id/first_nav_graph"
            app:startDestination="@id/AFirstFragment">
            
            <fragment
            android:id="@+id/AFirstFragment"
            android:name="dn.marjan.navigationeditor.AFirstFragment"
            android:label="fragment_a_first"
            tools:layout="@layout/fragment_a_first" />
            <fragment
            android:id="@+id/ASecondFragment"
            android:name="dn.marjan.navigationeditor.ASecondFragment"
            android:label="fragment_a_second"
            tools:layout="@layout/fragment_a_second" />
            </navigation>
            
            

            حالا که دوتا فرگمنت داریم میتونیم پراپرتی startDestination رو به هرکدوم از فرگمنت هایی که میخوایم تغییر بدیم و خواهیم دید ایکن خونه هم جابجا میشه!
            حتی از در زبانه Design در قسمت Attributes هم میتونیم Start Destination رو تغییر بدیم.
            حالا محتوی لایه fragment_a_first.xml رو بصورت زیر تغییرمیدیم

            <?xml version="1.0" encoding="utf-8"?>
            <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
            xmlns:tools="http://schemas.android.com/tools"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            tools:context=".AFirstFragment">
            
            <TextView
            android:text="This is AFirstFragmet"
            android:layout_gravity="center_horizontal"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
            
            <Button
            android:id="@+id/btn_go_sec"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:text="Go to ASecondFragment" />
            
            </FrameLayout>
            و همینطور لایه fragment_a_second.xml که بصورت زیر خواهد بود
            <?xml version="1.0" encoding="utf-8"?>
            <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
            xmlns:tools="http://schemas.android.com/tools"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            tools:context=".ASecondFragment">
            <TextView
            android:text="This is ASecondFragmet"
            android:layout_gravity="center"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
            
            </FrameLayout>
            
            

            خب حالا فقط کافیه که فلش فرگمنت اول رو به فرگمنت دوم وصل بصورت زیر

            آموزش Navigation Editor در اندروید استودیو

            آموزش Navigation Editor در اندروید استودیو

            همچنین به زبانه Text میریم و خواهیم دید که یک تگ action درون fragment ایجاد شده و طبیعتا مشخص میکنه که به کدوم فرگمنت وصل میشه

            <?xml version="1.0" encoding="utf-8"?>
            <navigation 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:id="@+id/first_nav_graph"
            app:startDestination="@id/AFirstFragment">
            
            <fragment
            android:id="@+id/AFirstFragment"
            android:name="dn.marjan.navigationeditor.AFirstFragment"
            android:label="fragment_a_first"
            tools:layout="@layout/fragment_a_first">
            <action
            android:id="@+id/action_AFirstFragment_to_ASecondFragment"
            app:destination="@id/ASecondFragment" />
            </fragment>
            <fragment
            android:id="@+id/ASecondFragment"
            android:name="dn.marjan.navigationeditor.ASecondFragment"
            android:label="fragment_a_second"
            tools:layout="@layout/fragment_a_second" />
            </navigation>
            
            

            الان گراف میدونه که یک ارتباط از فرگمنت اول به فرگمنت دوم برقرار شده الان فقط باید دستورشو بنویسیم
            پس میریم به AFirstFragment و محتویات رو بصورت زیر تغییر میدیم

            package dn.marjan.navigationeditor
            
            import android.os.Bundle
            import android.support.v4.app.Fragment
            import android.view.LayoutInflater
            import android.view.View
            import android.view.ViewGroup
            import androidx.navigation.fragment.findNavController
            import kotlinx.android.synthetic.main.fragment_a_first.view.*
            
            class AFirstFragment : Fragment() {
            override fun onCreateView(
            inflater: LayoutInflater, container: ViewGroup?,
            savedInstanceState: Bundle?
            ): View? {
            // Inflate the layout for this fragment
            val view= inflater.inflate(R.layout.fragment_a_first, container, false)
            
            view.btn_go_sec.setOnClickListener { findNavController().navigate(R.id.ASecondFragment) }
            
            return view
            }
            
            }
            
            

             

            دستور مورد نظر ما

            findNavController().navigate(R.id.ASecondFragment)
            
            

            هستش که مشخص میکنه زمان کلیک شدن برروی دکمه به چه مقصدی باید حرکت کند.

            الان اگر برنامه رو ران کنیم مطابق گیف پایین میبینیم که اپ که بالا میاد فرگمنت AFirstFragment.kt لود میشه (به معنی این که نقطه استارت فرگمنت هاست) و اگر روی دکمه داخل فرگمنت کلیک کنیم میریم به فرگمنت بعدی که یعنی برنامه درست کار میکنیه

            کار با Navigation Editor

            کار با Navigation Editor

             

            ایجاد انیمیشن زمان انتقال بین صفحات

            حتی میتونیم یک سری انیمیشن خاص درست زمانی که فلش رو بین صفحات وصل میکنیم برای اون انتقال تعریف کنیم.
            برای اینکار باید ابتدا فلشی که میخوایم برای اون نتقال انیمیشن بذاریم رو انتخاب میکنیم و به پنل Attributes در بخش Animations میریم

            آموزش Navigation Editor در اندروید استودیو

            آموزش Navigation Editor در اندروید استودیو

            قبل از اینکه مقادیر رو تغییر بدیم بهتره که بدونیم هرکدوم به چه معنی هستش
            enterAnim :‌ انیمیشینی برای ورود به یک مقصد
            exitAnim : انیمیشنی برای خروج از یک مقصد
            popEnterAnim : انیمیشینی برای ورود به یک مقصد زمان backstack
            popExitAnim : انیمیشینی برای خروج از یک مقصد زمان backstack

            خب میتونیم در پنل Attributes بخش Animation این مقادیر رو تغییر بدیم و خواهیم دید که کدشون هم در بخش کد های گراف نوشته میشه.

             

            تعریف آرگومان هایی جهت ارسال به مقصد

            برای ارسال آرگومان به مقصد دوراه داریم که در ادامه هردورو باهم بررسی میکنیم.

            راه اول انتقال داده در Navigation Editor

             

            راه اول اینکه با استفاده از قابلیت Argumants خود نویگیشن ادیتور دیتارو منتقل کنیم
            برای اینکار به بخش design نویگیشن ادیتور میریم و فرگمنت مبدا رو انتخاب میکنیم حالا در پنل Attributes بخش Argumants مطابق تصویر زیر

            کار با Navigation Editor

            کار با Navigation Editor

            علامت + را میزنیم و خواهیم دید یک پنجره باز خواهد شد که اطلاعات ارگومان را از ما میخواد پس اطلاعات رو مطابق تصویر زیر پر خواهیم کرد

            کار با Navigation Editor

            کار با Navigation Editor

            در عکس بالا ما یک ارگومان string ساختیم و حالا یک integer هم میسازیم

            آموزش Navigation Editor در اندروید استودیو

            آموزش Navigation Editor در اندروید استودیو

            حالا خواهیم دید که این دو ارگومان در پنل Argumants نمایش داده میشوند.
            همچنین درکدها نیز ارگومان ها چنین ایجاد شدند.

            <fragment
            android:id="@+id/AFirstFragment"
            android:name="dn.marjan.navigationeditor.AFirstFragment"
            android:label="fragment_a_first"
            tools:layout="@layout/fragment_a_first">
            <action
            android:id="@+id/action_AFirstFragment_to_ASecondFragment2"
            app:destination="@id/ASecondFragment"
            app:enterAnim="@anim/nav_default_enter_anim"
            app:exitAnim="@anim/nav_default_exit_anim"
            app:launchSingleTop="false"
            app:popEnterAnim="@anim/nav_default_pop_enter_anim"
            app:popExitAnim="@anim/nav_default_pop_exit_anim"
            app:popUpToInclusive="false"/>
            <argument
            android:name="str1"
            app:argType="string" />
            <argument
            android:name="integ1"
            android:defaultValue="0"
            app:argType="integer" />
            
            </fragment>
            
            

            اما برای این روشی که مامیخوایم دیتا رو انتقال بدیم باید دو تگ argumant رو داخل action هم کپی کنیم پس بدین صورت تغییر پیدا میکنه

            <fragment
            android:id="@+id/AFirstFragment"
            android:name="dn.marjan.navigationeditor.AFirstFragment"
            android:label="fragment_a_first"
            tools:layout="@layout/fragment_a_first">
            <action
            android:id="@+id/action_AFirstFragment_to_ASecondFragment"
            app:destination="@id/ASecondFragment"
            app:enterAnim="@anim/nav_default_enter_anim"
            app:exitAnim="@anim/nav_default_exit_anim"
            app:launchSingleTop="false"
            app:popEnterAnim="@anim/nav_default_pop_enter_anim"
            app:popExitAnim="@anim/nav_default_pop_exit_anim"
            app:popUpToInclusive="false">
            <argument
            android:name="str1"
            app:argType="string" />
            <argument
            android:name="integ1"
            android:defaultValue="0"
            app:argType="integer" />
            </action>
            <argument
            android:name="str1"
            app:argType="string" />
            <argument
            android:name="integ1"
            android:defaultValue="0"
            app:argType="integer" />
            
            </fragment>
            
            

             

            حالا دپندنسی های Sage Args رو به گردل اضافه کنیم.

             

            در فایل build.gradle مربوط به project
            buildscript {
            repositories {
            google()
            }
            dependencies {
            classpath "android.arch.navigation:navigation-safe-args-gradle-plugin:1.0.0-alpha11"
            }
            }
            
            

            و در فایل build.gradle مربوط به module هم باید پلاگین safeargs رو به بالای فایل اضافه کنیم که اگر از جاوا استفاده میکنید

            androidx.navigation.safeargs

            و اگر از کاتلین استفاده میکنید

            androidx.navigation.safeargs.kotlin

            و نتیجه بصورت زیر

            apply plugin: 'com.android.application'
            apply plugin: 'androidx.navigation.safeargs.kotlin'
            
            android {
            //...
            }
            
            

             

            حالا اصلا این دپندسی ها چیکار میکنن برای ما؟!!

            این پلاگین و دپندسی ها برای ساخت یا به اصطلاح generate کردن کلاس ها و builder های موردنظر برای ارسال آرگومان با Navigation Editor هستش.

            بعد از اضافه کردن و sync کردن فایل های زیر generate میشن :

            • یک کلاس برای هر مقصد یا destination ایجاد شده. به این صورت که نام کلاس + Directions
              برای مثال فرگمنت ما که AFirstFragment هست و چون براش آرگومان ساختیم یک کلاس با نام AFirstFragmentDirections ایجاد شده.
            •  برای هر actionی که یک سری ارگومان در بدنه خود دارد به جهت انتقال هم یک کلاس با نام ایدی همان اکشن ایجاد میشه
              برای مثال ما در اکشنی با ایدی action_AFirstFragment_to_ASecondFragment دو آرگومان ایجاد کردیم پس کلاسی که برای این اکشن generate شده با عنوان actionAFirstFragmentToASecondFragment هستش
            • کلاسی برای فرگمنتی که درون بدنه آن آرگومان تعریف شده.
              که نام کلاس ایجاد شده ترکیبی از نام کلاس + Args هستش.
              برای مثال ما در فرگمنت AFirstFragment در گراف دو آرگومان ایجاد کردیم پس کلاسی با عنوان AFirstFragmentArgs.kt برای اون ایجاد شده

            حالا برای ارسال دیتا برای اون دو آرگومانی که در گراف ایجاد کردیم کافیه که دستور زیر رو برای زمان ClickListener دکمه درون فرگمنت اول بنویسیم

            view.btn_go_sec.setOnClickListener {
            val action = AFirstFragmentDirections.actionAFirstFragmentToASecondFragment("hello world",20)
            findNavController().navigate(action)
            }
            

            و در فرگمنت دوم هم بدین صورت دیتا هارو در متد onCreate بگیریم

            override fun onCreate(savedInstanceState: Bundle?) {
            super.onCreate(savedInstanceState)
            val args: AFirstFragmentArgs by navArgs()
            param1 = args.str1
            param2 = args.integ1
            }
            
            

            به همین سادگی :)‌ !

             

            راه دوم ارسال دیتا در Navigation Editor

             

            راه دوم اینکه با استفاده از Bundle مقادیر رو ارسال کنیم
            پس متد listener بصورت زیر خواهد شد

            view.btn_go_sec.setOnClickListener {
            val bundle = Bundle()
            bundle.putString("str1","hello world !")
            bundle.putInt("integ1",20)
            findNavController().navigate(R.id.ASecondFragment,bundle)
            }
            
            

            با استفاده از Bundle مقادیر رو تعریف کردیم و همراه با متد navigate ارسال کردیم
            حالا کافیه در فرگمنت ASecondFragment به این صورت مقادیر رو بگیریم

            
            import android.os.Bundle
            import android.support.v4.app.Fragment
            import android.view.LayoutInflater
            import android.view.View
            import android.view.ViewGroup
            
            class ASecondFragment : Fragment() {
            private var param1: String? = null
            private var param2: Int? = 0
            
            override fun onCreate(savedInstanceState: Bundle?) {
            super.onCreate(savedInstanceState)
            arguments?.let {
            param1 = it.getString("str1")
            param2 = it.getInt("integ1",0)
            }
            }
            
            override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?,
            savedInstanceState: Bundle?): View? {
            // Inflate the layout for this fragment
            return inflater.inflate(R.layout.fragment_a_second, container, false)
            }
            
            }
            
            

            که در این بخش ما مقادیر دریافتی رو گرفتیم

            override fun onCreate(savedInstanceState: Bundle?) {
            super.onCreate(savedInstanceState)
            arguments?.let {
            param1 = it.getString("str1")
            param2 = it.getInt("integ1",0)
            }
            }
            
            

            ایجاد Deep Link برای یک فرگمنت

            یک توضیح کوتاه درباره deep link بدیم این ست که با فراخوانی یک لینک مشخص بتونیم از خارج از برنامه به یک صفحه خاص در برنامه بریم.
            در navigation editor پس از انتخاب یک فرگمنت
            میتونیم در پنل Attributes به بخش Deep Links بریم و دکمه + رو کلیک کنیم

            کار با Navigation Editor

            کار با Navigation Editor

            بعد از اون در پنجره ای که برامون باز میشه یک لینک کاملا دلخواه مینویسیم

            کار با Navigation Editor

            کار با Navigation Editor

            اگر به کدهای گراف هم نگاه کنیم خواهیم دید چنین کدی برای فرگمنت انتخابی ایجاد شده

            <deepLink
            android:id="@+id/deepLink"
            app:uri="http://naveditor" />
            
            

            حالا کافیه که در manifest برنامه چنین دستوری رو در تگ actvity خونه مون بنویسیم

            
            <nav-graph android:value="@navigation/first_nav_graph" />
            
            

            و پروژه رو build کنیم
            حالا اگر روی زبانه Merged Manifest کلیک کنید مانند عکس زیر خواهید دید که اطلاعات deep link ایجاد شدند.

            کار با Navigation Editor

            کار با Navigation Editor

            و خواهیم دید با فراخوانی این لینک در هرکجای موبایل این صفحه از اپلیکیشن باز خواهد شد.

            برای مدیریت deep link کافیه که این خط کدرو در onCreate اکتیوتی بنویسید

            findNavController(this, R.id.navHostFragment).onHandleDeepLink(intent)
            
            

            و در نهایت در متد onNewIntent مربوط به اکتیویتی هم دستور زیر رو بنویسید

            override fun onNewIntent(intent: Intent?) {
            super.onNewIntent(intent)
            findNavController(this, R.id.navHostFragment).onHandleDeepLink(intent)
            }
            
            

            هر گراف مشخص کننده شمای کلی یک اکتیویتی و فرگمنت های داخلشه و برای اینکه بخوایم دو اکتیویتی رو به هم وصل کنیم میتونیم اکتیویتی هارو در ۲ گراف پیاده کنیم و بعد گراف هارو به هم متصل کنیم.
            برای مثال من مطابق آموزش ها یک اکتیویتی و یک گراف دیگه میسازم و اکتیویتی دومم با نام SecondActivity رو به واسطه NavHostFragment خونه اون گراف میکنم
            و همچنین یک فرگمنت هم برای این گراف ایجاد میکنم در نتیجه گراف بصورت زیر خواهد شد

            آموزش Navigation Editor در اندروید استودیو

            آموزش Navigation Editor در اندروید استودیو

            حالا گراف دوم با نام Second_nav_graph رو بصورت زیر به گراف اول با نام first_nav_graph اضافه میکنم

            عکس

            و خواهید دید که همچین کدی به هم به گراف اضافه شده

            <include app:graph="@navigation/second_nav_graph"/>
            
            

            و فلش انتقال رو به این صورت تغییر میدم

            آموزش Navigation Editor در اندروید

            آموزش Navigation Editor در اندروید

            و در انتها فقط کافیست در فایل AFirstFragment.kt در بلاک listener چنین تغییراتی ایجاد کنیم

            view.btn_go_sec.setOnClickListener {
            // val action = AFirstFragmentDirections.actionAFirstFragmentToASecondFragment("hello world",20)
            findNavController().navigate(R.id.second_nav_graph)
            }
            
            

            برنامه رو اجرا کنید و دکمه درون فرگمنت اول رو بزنید خواهید دید که که به اکتیویتی SecondActivity.kt منتقل خواهد شد. 🙂

             

             

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

             

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

            پست های مرتبط

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

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

            30 بهمن 1400

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


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

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

            30 بهمن 1400

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


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

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

            27 بهمن 1400

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


            ادامه مطلب

            2 Comments

            1. بهمن گفت:
              6 بهمن 1397 در 00:03

              خیلی عالی بود
              ممننونن

              پاسخ
            2. بهنام گفت:
              24 فروردین 1399 در 04:02

              سلام .
              بسیار عالی ممنون از آموزش بسیار مفیدتون .
              یک سوال : من یک پروژه دارم که تقریبا بزرگه و تعداد زیادی اکتیویتی و فرگمنت داره . از حالت قدیمی برای حرکت بین صفحات استفاده کردم . آیا میتونم کل پروژه رو در Navigation component باز کنم . مسیرهای قبلی رو ببینم و اونها رو از اینجا تغییر بدم . بدوب بروز مشکل ؟

              ممنون میشم راهنمایی کنید .

              پاسخ

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

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

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

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

             
            کلیک کنید

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

            • 7 خرداد 1401

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

            • 6 فروردین 1401

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

            • 3 فروردین 1401

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

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

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

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