استفاده مجدد از طرح‌بندی‌ها با <include>

روش نوشتن را امتحان کنید
Jetpack Compose ابزار رابط کاربری پیشنهادی برای اندروید است. یاد بگیرید که چگونه با طرح‌بندی‌ها در Compose کار کنید.

اگرچه اندروید ویجت‌های متنوعی را برای ارائه عناصر کوچک، قابل استفاده مجدد و تعاملی ارائه می‌دهد، اما ممکن است نیاز به استفاده مجدد از اجزای بزرگتری که به یک طرح‌بندی خاص نیاز دارند نیز داشته باشید. برای استفاده مجدد کارآمد از طرح‌بندی‌های کامل، از برچسب‌های <include> و <merge> برای جاسازی یک طرح‌بندی در داخل طرح‌بندی دیگر استفاده کنید.

این به شما امکان می‌دهد طرح‌بندی‌های پیچیده‌ای ایجاد کنید - مانند یک پنل دکمه بله یا خیر یا یک نوار پیشرفت سفارشی با متن توضیحی. و این بدان معناست که می‌توانید هر عنصری از برنامه خود را که در چندین طرح‌بندی مشترک است، استخراج کنید، آنها را جداگانه مدیریت کنید و در هر طرح‌بندی بگنجانید. در حالی که می‌توانید با نوشتن یک View سفارشی، اجزای رابط کاربری جداگانه ایجاد کنید، می‌توانید با استفاده مجدد از یک فایل طرح‌بندی، این کار را راحت‌تر انجام دهید.

ایجاد یک طرح‌بندی قابل استفاده مجدد

با ایجاد یک فایل XML جدید و تعریف طرح‌بندی مورد نظر برای استفاده مجدد، شروع کنید. برای مثال، در اینجا یک طرح‌بندی وجود دارد که یک نوار عنوان را برای قرار دادن در هر فعالیت ( titlebar.xml ) تعریف می‌کند:

<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="wrap_content"
    android:background="@color/titlebar_bg"
    tools:showIn="@layout/activity_main" >

    <ImageView android:layout_width="wrap_content"
               android:layout_height="wrap_content"
               android:src="@drawable/gafricalogo" />
</FrameLayout>

View ریشه باید دقیقاً همانطور که می‌خواهید در هر طرح‌بندی که قصد اضافه کردن این طرح‌بندی را دارید، نمایش داده شود.

از تگ <include> استفاده کنید

درون طرح‌بندی که می‌خواهید کامپوننت قابل استفاده مجدد را به آن اضافه کنید، تگ <include> را اضافه کنید. برای مثال، در اینجا طرح‌بندی‌ای را مشاهده می‌کنید که شامل نوار عنوان از مثال قبلی است:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/app_bg"
    android:gravity="center_horizontal">

    <include layout="@layout/titlebar"/>

    <TextView android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:text="@string/hello"
              android:padding="10dp" />
    ...
</LinearLayout>

همچنین می‌توانید تمام پارامترهای طرح‌بندی - هر ویژگی android:layout_* - نمای ریشه طرح‌بندی گنجانده شده را با مشخص کردن آنها در تگ <include> لغو کنید. این در مثال زیر نشان داده شده است:

<include android:id="@+id/news_title"
         android:layout_width="match_parent"
         android:layout_height="match_parent"
         layout="@layout/title"/>

با این حال، اگر می‌خواهید ویژگی‌های طرح‌بندی را با استفاده از تگ <include> لغو کنید، android:layout_height و android:layout_width را نیز لغو کنید تا سایر ویژگی‌های طرح‌بندی اعمال شوند.

از تگ <ادغام> استفاده کنید

تگ <merge> به حذف گروه‌های نمای اضافی در سلسله مراتب نمای شما هنگام گنجاندن یک طرح‌بندی در طرح‌بندی دیگر کمک می‌کند. یکی از موارد استفاده <merge> زمانی است که شما با بسط دادن یک ViewGroup یک نمای سفارشی پیاده‌سازی می‌کنید.

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

در عوض، می‌توانید یک LinearLayout برای ایجاد یک نمای سفارشی گسترش دهید و از یک XML طرح‌بندی برای توصیف نماهای فرزند آن استفاده کنید. همانطور که در مثال زیر نشان داده شده است، تگ بالای XML به جای LinearLayout ، <merge> است:

<merge xmlns:android="http://schemas.android.com/apk/res/android">

    <Button
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="@string/add"/>

    <Button
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="@string/delete"/>

</merge>

وقتی این طرح‌بندی را در طرح‌بندی دیگری - با استفاده از تگ <include> - قرار می‌دهید، سیستم عنصر <merge> را نادیده می‌گیرد و دو دکمه را مستقیماً در طرح‌بندی، به جای تگ <include> قرار می‌دهد.

برای اطلاعات بیشتر در مورد <include> ، به منبع طرح‌بندی مراجعه کنید.