ویرایشگر پیمایش

‫Android Studio دارای یک رابط کاربری گرافیکی است که به شما امکان می‌دهد نمودار پیمایش ایجاد و ویرایش کنید. این اساساً ویرایشگری برای فایل منبع XML زیربنایی است.

نمای کلی

پس‌از اینکه نمودار XML را به برنامه‌تان اضافه کردید، Android Studio نمودار را در ویرایشگر پیمایش باز می‌کند. در «ویرایشگر پیمایش»، می‌توانید گراف‌های پیمایش را به‌صورت دیداری ویرایش کنید یا مستقیماً XML زیرین را ویرایش کنید.

شکل ۱. ویرایشگر پیمایش
  1. پانل مقصدها: میزبان پیمایش و همه مقصدها را در ویرایشگر گراف فهرست می‌کند.
  2. ویرایشگر گراف: حاوی نمایش تصویری از گراف پیمایش شما است. می‌توانید بین نمای طراحی و نمایش XML زیرین در نمای نوشتار جابه‌جا شوید.
  3. مشخصه‌ها: مشخصه‌های مورد انتخابی را در گراف پیمایش نشان می‌دهد.

روی برگه نوشتار کلیک کنید تا XML مربوطه را ببینید که باید شبیه تکه‌کد زیر باشد:

<?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"
            android:id="@+id/nav_graph">

</navigation>

عنصر <navigation> عنصر ریشه نمودار پیمایش است. هم‌زمان با افزودن مقصدها و کنش‌های اتصال به نمودارتان، می‌توانید عناصر <destination> و <action> مربوطه را در اینجا به‌عنوان عناصر فرزند ببینید. اگر گراف‌های تو در تو داشته باشید، به‌عنوان عناصر <navigation> فرزند ظاهر می‌شوند.

افزودن مقصدها

می‌توانید مقصد را از فعالیت یا تکه‌کد موجود ایجاد کنید. همچنین می‌توانید از «ویرایشگر پیمایش» برای ایجاد مقصد جدید یا ایجاد جای‌بان استفاده کنید تا بعداً آن را با قطعه یا فعالیت جایگزین کنید.

این مثال نشان می‌دهد که چگونه می‌توان مقصد جدیدی ایجاد کرد. برای افزودن مقصد جدید بااستفاده از «ویرایشگر پیمایش»، مراحل زیر را انجام دهید:

  1. در «ویرایشگر پیمایش»، روی نماد مقصد جدید کلیک کنید، و سپس روی ایجاد مقصد جدید کلیک کنید.
  2. در کادر گفتگوی عنصر جدید Android که ظاهر می‌شود، قطعه‌تان را ایجاد کنید. برای اطلاعات بیشتر درباره قطعه‌ها، نمای کلی قطعه‌ها را ببینید.

در «ویرایشگر پیمایش»، متوجه می‌شوید که Android Studio این مقصد را به گراف اضافه کرده است.

شکل ۲ نمونه‌ای از مقصد و مقصد جای‌بان را نشان می‌دهد.

شکل ۲. مقصد و جای‌بان

برای روش‌های دیگر افزودن مقصد به گراف پیمایش، مقاصد اضافی را ببینید.

ایجاد مقصد از فعالیت یا تکه‌کد موجود

در «ویرایشگر پیمایش»، اگر نوع مقصد موجودی دارید که می‌خواهید به گراف پیمایش خود اضافه کنید، روی مقصد جدید کلیک کنید.

سپس، روی مقصد مربوطه در منوِ کرکره‌ای که ظاهر می‌شود کلیک کنید. اکنون می‌توانید پیش‌نمایشی از مقصد را در نمای طراحی به‌همراه XML مربوطه در نمای نوشتار نمودار پیمایش خود ببینید.

ایجاد مقصد تکه‌کد جدید

برای افزودن نوع مقصد جدید بااستفاده از «ویرایشگر پیمایش»، مراحل زیر را انجام دهید:

  1. در «ویرایشگر پیمایش»، روی نماد مقصد جدید کلیک کنید.

    سپس روی ایجاد مقصد جدید کلیک کنید.

  2. در کادر گفتگوی عنصر جدید Android که ظاهر می‌شود، قطعه‌تان را ایجاد کنید.

در «ویرایشگر پیمایش»، متوجه می‌شوید که Android Studio این مقصد را به گراف اضافه کرده است.

شکل ۳ نمونه‌ای از مقصد و مقصد جای‌بان را نشان می‌دهد.

شکل ۳. مقصد و جای‌بان

تشریح مقصد

روی مقصد کلیک کنید تا آن را انتخاب کنید و ویژگی‌های زیر را در پانل ویژگی‌ها یادداشت کنید:

  • فیلد نوع نشان می‌دهد که مقصد به‌عنوان تکه، فعالیت، یا کلاس سفارشی دیگری در کد منبع شما پیاده‌سازی شده است یا نه.
  • فیلد برچسب حاوی نام مقصد است که کاربر می‌تواند آن را بخواند. این ممکن است در رابط کاربری نشان داده شود—برای مثال، اگر NavGraph را بااستفاده از setupWithNavController() به Toolbar متصل کنید. به همین دلیل، از رشته‌های منبع برای این مقدار استفاده کنید.
  • فیلد شناسه حاوی شناسه مقصد است که برای ارجاع دادن به مقصد در کد استفاده می‌شود.
  • منو کرکره‌ای کلاس نام کلاسی را که با مقصد مرتبط است نشان می‌دهد. روی این منو کرکره‌ای کلیک کنید تا کلاس مرتبط را به نوع مقصد دیگری تغییر دهید.

روی برگه نوشتار کلیک کنید تا نمای XML نمودار پیمایش خود را نشان دهید. «زبان نشانه‌گذاری توسعه‌پذیر» شامل همان مشخصه‌های id، name، label، و layout برای مقصد است، همان‌طور که در تکه‌کد زیر نشان داده شده است:

<?xml version="1.0" encoding="utf-8"?>
<navigation xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:android="http://schemas.android.com/apk/res/android"
    app:startDestination="@id/blankFragment">
    <fragment
        android:id="@+id/blankFragment"
        android:name="com.example.cashdog.cashdog.BlankFragment"
        android:label="@string/label_blank"
        tools:layout="@layout/fragment_blank" />
</navigation>

همچنین می‌توانید از ویرایشگر چیدمان برای افزودن NavHostFragment به فعالیت با انجام مراحل زیر استفاده کنید:

  1. در فهرست فایل‌های پروژه، روی فایل XML چیدمان فعالیتتان دوبار کلیک کنید تا در «ویرایشگر چیدمان» باز شود.
  2. در قاب پالت، دسته ظروف را انتخاب کنید؛ یا اینکه «NavHostFragment» را جستجو کنید.
  3. نمای NavHostFragment را روی فعالیتتان بکشید.
  4. در چارگوش گفتگوی گراف‌های پیمایش که ظاهر می‌شود، گراف پیمایش مربوطه را برای مرتبط کردن با این NavHostFragment انتخاب کنید، و سپس روی تأیید کلیک کنید.

متصل کردن مقصدها

کنش یک اتصال منطقی بین مقصدها است. کنش‌ها در گراف پیمایش به‌صورت پیکان نشان داده می‌شوند. کنش‌ها معمولاً یک مقصد را به مقصد دیگری متصل می‌کنند، هرچند می‌توانید کنش‌های عمومی نیز ایجاد کنید که شما را از هر جایی در برنامه‌تان به مقصد خاصی می‌برند.

با کنش‌ها، مسیرهای مختلفی را که کاربران می‌توانند در برنامه شما طی کنند نشان می‌دهید. توجه داشته باشید که برای ناوبری واقعی به مقصدها، همچنان باید کد انجام ناوبری را بنویسید.

با انجام مراحل زیر می‌توانید از «ویرایشگر پیمایش» برای متصل کردن دو مقصد استفاده کنید:

  1. در برگه طراحی، نشانگر را روی سمت راست مقصد موردنظر برای پیمایش کاربران نگه دارید. دایره‌ای در سمت راست مقصد ظاهر می‌شود، همان‌طور که در شکل ۴ نشان داده شده است.

    شکل ۴. مقصد با اتصال کنش دایره
  2. مکان‌نما را روی مقصد موردنظرتان که می‌خواهید کاربران به آن پیمایش کنند بکشید و رها کنید. خط حاصل بین دو مقصد نشان‌دهنده یک کنش است، همان‌طور که در شکل ۵ نشان داده شده است.

    شکل ۵. اتصال مقصدها با کنش
  3. برای برجسته کردن کنش، روی پیکان کلیک کنید. مشخصه‌های زیر در پانل مشخصه‌ها نشان داده می‌شود:

    • فیلد نوع حاوی «کنش» است.
    • فیلد شناسه حاوی شناسه کنش است.
    • فیلد مقصد حاوی شناسه قطعه مقصد یا فعالیت است.
  4. روی برگه نوشتار کلیک کنید تا به نمای XML بروید. عنصر کنش اکنون به مقصد منبع اضافه شده است. کنش دارای شناسه و مشخصه مقصد است که حاوی شناسه مقصد بعدی است، همان‌طور که در مثال زیر نشان داده شده است:

    xml <?xml version="1.0" encoding="utf-8"?> <navigation xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" xmlns:android="http://schemas.android.com/apk/res/android" app:startDestination="@id/blankFragment"> <fragment android:id="@+id/blankFragment" android:name="com.example.cashdog.cashdog.BlankFragment" android:label="@string/label_blank" tools:layout="@layout/fragment_blank" > <action android:id="@+id/action_blankFragment_to_blankFragment2" app:destination="@id/blankFragment2" /> </fragment> <fragment android:id="@+id/blankFragment2" android:name="com.example.cashdog.cashdog.BlankFragment2" android:label="@string/label_blank_2" tools:layout="@layout/fragment_blank_fragment2" /> </navigation>

در گراف پیمایش شما، کنش‌ها با عناصر <action> نشان داده می‌شوند. حداقل، کنش حاوی شناسه خود و شناسه مقصدی است که کاربر باید به آنجا هدایت شود.

مقصد جای‌بان

می‌توانید از جای‌بان‌ها برای نشان دادن مقصد‌های پیاده‌سازی‌نشده استفاده کنید. جای‌بان به‌عنوان نمایش تصویری مقصد عمل می‌کند. در «ویرایشگر پیمایش»، می‌توانید از جای‌بان‌ها درست مانند هر مقصد دیگری استفاده کنید.