web-dev-qa-db-fra.com

Contrainte Mise en page sur Mesure très lente

j'ai donc essayé de refactoriser une partie de mon recycleur ViewHolders en ConstraintLayouts. Après l'avoir fait, j'ai été choqué par ce que j'ai vu. Le gonflage d'une seule vue prend 20 fois plus de temps que d'habitude LinearLayout. En fait, il saute tellement de trames en le faisant.

EDIT: La version de la disposition des contraintes n'est pas pertinente. Différentes combinaisons essayées ont eu presque les mêmes résultats.

Quelqu'un peut-il expliquer pourquoi cela se produit? Peut-être qu'il n'est pas conçu pour des vues aussi "lourdes"?

Voici une racine XML qui est utilisée dans ViewHolder:

<LinearLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    Android:background="@color/white"
    Android:elevation="@dimen/param_2"
    Android:orientation="vertical"
    Android:stateListAnimator="@animator/material_selector">

    <LinearLayout
        Android:id="@+id/order_view_tabs_container"
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content"
        Android:layout_marginBottom="@dimen/param_2"
        Android:padding="@dimen/param_4"
        Android:background="@color/white"
        Android:divider="@drawable/empty_horizontal_divider"
        Android:elevation="@dimen/param_2"
        Android:orientation="horizontal"
        Android:showDividers="middle"
        Android:visibility="gone"/>

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

    </LinearLayout>

Et voici order_list_item_constraint.xml

<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="wrap_content"
    Android:padding="@dimen/param_4"
    Android:clipToPadding="false">

    <TextView
        Android:id="@+id/delivery_status"
        style="@style/DefaultText.Normal"
        Android:layout_width="0dp"
        Android:layout_height="50dp"
        Android:layout_marginEnd="4dp"
        Android:padding="4dp"
        Android:background="@color/white"
        Android:elevation="2dp"
        Android:gravity="center_vertical"
        Android:text="@string/main_swipe_list_item_info_title_delivered_time"
        app:layout_constraintEnd_toStartOf="@id/mid_guideline"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        tools:layout_editor_absoluteY="4dp"/>

    <TextView
        Android:id="@+id/order_list_item_order_title"
        style="@style/FullListItemInfoText"
        Android:layout_width="0dp"
        Android:layout_marginTop="4dp"
        Android:text="@string/main_swipe_list_item_info_title_order"
        Android:textColor="@color/red_900"
        app:layout_constraintEnd_toEndOf="@id/mid_guideline"
        app:layout_constraintStart_toStartOf="@id/start_guideline"
        app:layout_constraintTop_toBottomOf="@+id/delivery_status"/>

    <TextView
        Android:id="@+id/order_list_item_order_id"
        style="@style/FullListItemInfoDetailsText"
        Android:layout_width="0dp"
        app:layout_constraintEnd_toEndOf="@id/mid_guideline"
        app:layout_constraintStart_toStartOf="@+id/start_guideline"
        app:layout_constraintTop_toBottomOf="@id/order_list_item_order_title"
        />

    <TextView
        Android:id="@+id/order_list_item_price_title"
        style="@style/FullListItemInfoText"
        Android:layout_width="0dp"
        Android:layout_marginTop="4dp"
        Android:text="@string/main_swipe_list_item_info_title_sum"
        app:layout_constraintEnd_toEndOf="@id/mid_guideline"
        app:layout_constraintStart_toStartOf="@id/start_guideline"
        app:layout_constraintTop_toBottomOf="@+id/order_list_item_order_id"
        />

    <TextView
        Android:id="@+id/order_list_item_price"
        style="@style/FullListItemInfoDetailsText"
        Android:layout_width="0dp"
        app:layout_constraintEnd_toEndOf="@id/mid_guideline"
        app:layout_constraintStart_toStartOf="@+id/start_guideline"
        app:layout_constraintTop_toBottomOf="@id/order_list_item_price_title"
        />


    <TextView
        Android:id="@+id/order_list_item_threshold_title"
        style="@style/FullListItemInfoText"
        Android:layout_width="0dp"
        Android:layout_marginTop="4dp"
        Android:text="@string/order_full_list_item_threshold_value_title"
        app:layout_constraintEnd_toEndOf="@id/mid_guideline"
        app:layout_constraintStart_toStartOf="@id/start_guideline"
        app:layout_constraintTop_toBottomOf="@+id/order_list_item_price"
        />

    <TextView
        Android:id="@+id/order_list_item_threshold_value"
        style="@style/FullListItemInfoDetailsText"
        Android:layout_width="0dp"
        app:layout_constraintEnd_toEndOf="@id/mid_guideline"
        app:layout_constraintStart_toStartOf="@+id/start_guideline"
        app:layout_constraintTop_toBottomOf="@id/order_list_item_threshold_title"
        />


    <TextView
        Android:id="@+id/order_list_item_sl_title"
        style="@style/FullListItemInfoText"
        Android:layout_width="0dp"
        Android:layout_marginTop="@dimen/param_4"
        Android:text="@string/main_swipe_list_item_info_title_service_level"
        app:layout_constraintEnd_toEndOf="@id/mid_guideline"
        app:layout_constraintStart_toStartOf="@id/start_guideline"
        app:layout_constraintTop_toBottomOf="@+id/order_list_item_threshold_value"/>


    <TextView
        Android:id="@+id/order_list_item_service_level_title"
        style="@style/FullListItemInfoDetailsText"
        Android:textStyle="bold"
        Android:layout_width="0dp"
        Android:textSize="@dimen/text_size_12"
        app:layout_constraintEnd_toEndOf="@id/mid_guideline"
        app:layout_constraintStart_toStartOf="@id/start_guideline"
        app:layout_constraintTop_toBottomOf="@+id/order_list_item_sl_title"/>

    <TextView
        Android:id="@+id/order_list_item_service_level_try_on"
        style="@style/FullListItemInfoDetailsText"
        Android:layout_width="0dp"
        Android:textSize="@dimen/text_size_12"
        app:layout_constraintEnd_toEndOf="@id/mid_guideline"
        app:layout_constraintStart_toStartOf="@id/start_guideline"
        app:layout_constraintTop_toBottomOf="@+id/order_list_item_service_level_title"/>


    <TextView
        Android:id="@+id/order_list_item_service_level_partial_purchase"
        style="@style/FullListItemInfoDetailsText"
        Android:layout_width="0dp"
        Android:textSize="@dimen/text_size_12"
        app:layout_constraintEnd_toEndOf="@id/mid_guideline"
        app:layout_constraintStart_toStartOf="@id/start_guideline"
        app:layout_constraintTop_toBottomOf="@+id/order_list_item_service_level_try_on"/>


    <com.express.mobile.customView.MyNetworkImageView
        Android:id="@+id/order_list_item_image_map"
        Android:layout_width="0dp"
        Android:layout_height="144dp"
        Android:elevation="2dp"
        Android:scaleType="centerCrop"
        Android:visibility="visible"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="@id/mid_guideline"
        app:layout_constraintTop_toTopOf="parent"/>

    <ImageView
        Android:id="@+id/order_list_item_map_pin"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:paddingBottom="@dimen/param_30"
        Android:contentDescription="@null"
        Android:elevation="2dp"
        Android:src="@drawable/ic_map_pin_sz_1"
        Android:visibility="gone"
        app:layout_constrainedHeight="true"
        app:layout_constrainedWidth="true"
        app:layout_constraintBottom_toBottomOf="@id/order_list_item_image_map"
        app:layout_constraintEnd_toEndOf="@id/order_list_item_image_map"
        app:layout_constraintStart_toStartOf="@id/order_list_item_image_map"
        app:layout_constraintTop_toTopOf="@id/order_list_item_image_map"/>


    <include
        Android:id="@+id/order_list_item_map_interval_box"
        layout="@layout/map_interval_box"
        Android:layout_width="wrap_content"
        Android:layout_height="@dimen/param_48"
        app:layout_constrainedWidth="true"
        app:layout_constraintStart_toStartOf="@id/order_list_item_image_map"/>

    <TextView
        Android:id="@+id/order_list_item_timer"
        style="@style/WhiteText.Large"
        Android:textStyle="bold"
        Android:layout_width="0dp"
        Android:layout_height="0dp"
        Android:background="@drawable/order_full_list_item_delivery_status_box_borders"
        Android:elevation="2dp"
        Android:gravity="center"
        Android:text="@string/timer_zero_time_value_text"
        Android:textSize="@dimen/text_size_24"
        Android:visibility="gone"
        app:layout_constraintBottom_toBottomOf="@id/order_list_item_map_interval_box"
        app:layout_constraintEnd_toEndOf="@id/order_list_item_map_interval_box"
        app:layout_constraintStart_toStartOf="@id/order_list_item_map_interval_box"
        app:layout_constraintTop_toTopOf="@id/order_list_item_map_interval_box"/>


    <ImageView
        Android:id="@+id/order_list_item_partner_icon"
        Android:layout_width="@dimen/param_40"
        Android:layout_height="@dimen/param_40"
        Android:layout_margin="4dp"
        Android:background="@drawable/order_mod_icon"
        Android:backgroundTint="@color/red_800"
        Android:contentDescription="@null"
        Android:elevation="@dimen/param_4"
        Android:scaleType="center"
        Android:src="@drawable/ic_partner"
        Android:visibility="gone"
        app:layout_constraintBottom_toBottomOf="@+id/order_list_item_image_map"
        app:layout_constraintStart_toStartOf="@+id/order_list_item_image_map"/>

    <ImageView
        Android:id="@+id/order_list_item_prepaid_icon"
        Android:layout_width="@dimen/param_40"
        Android:layout_height="@dimen/param_40"
        Android:layout_margin="4dp"
        Android:background="@drawable/order_mod_icon"
        Android:backgroundTint="@color/green_800"
        Android:contentDescription="@null"
        Android:elevation="@dimen/param_4"
        Android:scaleType="center"
        Android:src="@drawable/ic_prepaid"
        Android:visibility="gone"
        app:layout_constraintBottom_toBottomOf="@+id/order_list_item_image_map"
        app:layout_constraintStart_toEndOf="@id/order_list_item_partner_icon"/>

    <ImageView
        Android:id="@+id/order_list_item_microcredit_icon"
        Android:layout_width="@dimen/param_40"
        Android:layout_height="@dimen/param_40"
        Android:layout_margin="4dp"
        Android:background="@drawable/order_mod_icon"
        Android:backgroundTint="@color/blue_grey_700"
        Android:contentDescription="@null"
        Android:elevation="@dimen/param_4"
        Android:scaleType="center"
        Android:src="@drawable/ic_microcredit"
        Android:visibility="gone"
        app:layout_constraintBottom_toBottomOf="@+id/order_list_item_image_map"
        app:layout_constraintStart_toEndOf="@id/order_list_item_prepaid_icon"/>


    <ImageView
        Android:id="@+id/order_list_item_ongoing_icon"
        Android:layout_width="@dimen/param_40"
        Android:layout_height="@dimen/param_40"
        Android:layout_margin="4dp"
        Android:background="@drawable/order_mod_icon"
        Android:backgroundTint="@color/colorPrimaryDark"
        Android:contentDescription="@null"
        Android:elevation="@dimen/param_4"
        Android:scaleType="center"
        Android:src="@drawable/ic_delivery_time_ongoing"
        Android:visibility="gone"
        app:layout_constraintBottom_toBottomOf="@+id/order_list_item_image_map"
        app:layout_constraintStart_toEndOf="@id/order_list_item_microcredit_icon"/>


    <TextView
        Android:id="@+id/order_list_item_name"
        style="@style/FullListItemInfoDetailsText"
        Android:layout_width="0dp"
        Android:layout_height="@dimen/param_20"
        Android:layout_marginTop="8dp"
        Android:drawablePadding="@dimen/param_8"
        Android:drawableStart="@drawable/ic_man"
        Android:maxLines="1"
        app:layout_constraintEnd_toStartOf="@id/order_list_item_call_icon"
        app:layout_constraintStart_toStartOf="@id/mid_guideline"
        app:layout_constraintTop_toBottomOf="@id/order_list_item_image_map"/>

    <TextView
        Android:id="@+id/order_list_item_phone"
        style="@style/FullListItemInfoDetailsText"
        Android:layout_width="0dp"
        Android:layout_height="@dimen/param_20"
        Android:layout_marginStart="@dimen/param_28"
        Android:maxLines="1"
        app:layout_constraintEnd_toStartOf="@id/order_list_item_call_icon"
        app:layout_constraintStart_toStartOf="@id/mid_guideline"
        app:layout_constraintTop_toBottomOf="@id/order_list_item_name"/>

    <ImageView
        Android:id="@+id/address_icon"
        Android:layout_width="@dimen/param_20"
        Android:layout_height="@dimen/param_20"
        Android:layout_marginTop="4dp"
        Android:contentDescription="@null"
        Android:src="@drawable/ic_address"
        app:layout_constraintStart_toStartOf="@id/mid_guideline"
        app:layout_constraintTop_toBottomOf="@id/order_list_item_phone"/>

    <TextView
        Android:id="@+id/order_list_item_address"
        style="@style/FullListItemInfoDetailsText"
        Android:layout_width="0dp"
        Android:layout_weight="1"
        Android:layout_marginTop="4dp"
        Android:layout_marginStart="8dp"
        Android:layout_marginEnd="4dp"
        Android:minLines="2"
        app:layout_constraintEnd_toStartOf="@id/order_list_item_call_icon"
        app:layout_constraintStart_toEndOf="@id/address_icon"
        app:layout_constraintTop_toBottomOf="@id/order_list_item_phone"/>


    <ImageView
        Android:id="@+id/order_list_item_call_icon"
        Android:layout_width="38dp"
        Android:layout_height="38dp"
        Android:padding="@dimen/param_8"
        Android:background="@drawable/order_mod_icon"
        Android:contentDescription="@null"
        Android:elevation="@dimen/param_4"
        Android:src="@drawable/ic_call"
        Android:visibility="visible"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="@id/order_list_item_name"/>


    <ImageView
        Android:id="@+id/order_list_item_navigate_icon"
        Android:layout_width="38dp"
        Android:layout_height="38dp"
        Android:padding="@dimen/param_8"
        Android:background="@drawable/order_mod_icon"
        Android:contentDescription="@null"
        Android:elevation="@dimen/param_4"
        Android:src="@drawable/ic_order_navigate"
        Android:visibility="visible"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="@id/order_list_item_address"/>


    <Android.support.constraint.Guideline
        Android:id="@+id/mid_guideline"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:orientation="vertical"
        app:layout_constraintGuide_end="360dp"/>


    <Android.support.constraint.Guideline
        Android:id="@+id/start_guideline"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:orientation="vertical"
        app:layout_constraintGuide_begin="4dp"
        app:layout_constraintStart_toStartOf="parent"/>


     </Android.support.constraint.ConstraintLayout>

Voici la preuve du problème. Toutes les vues enfant ont des temps de mesure d'environ 0,1 ms HierarchyViewer

Comparaison d'un simple LinearLayoutenter image description here

EDIT2: Voici une version de mise en page avec LinearLayout: https://Pastebin.com/ZvffUHnw

androidxmlandroid-layoutandroid-constraintlayoutandroid-measure
15
Kęstas Venslauskas

Ce n'est certainement pas prévu - je vais devoir enquêter davantage pour voir ce qui en est la cause. Notez que la version 1.1 bêta sera actuellement plus lente que la version 1.0, toutes les passes d'optimisation ne sont pas activées. À première vue, il y a beaucoup de visualisation de texte avec une largeur de 0dp, ce qui est assez coûteux - comme avec une disposition linéaire, 0dp va entraîner une double mesure. Par exemple. au lieu de:

<TextView
    Android:id="@+id/order_list_item_order_title"
    Android:layout_width="0dp"
    Android:layout_height="20dp"
    Android:layout_marginTop="4dp"
    Android:text="@string/main_swipe_list_item_info_title_order"
    app:layout_constraintEnd_toEndOf="@id/mid_guideline"
    app:layout_constraintStart_toStartOf="@id/start_guideline"
    app:layout_constraintTop_toBottomOf="@+id/delivery_status"/>

Vous pourriez faire:

<TextView
    Android:id="@+id/order_list_item_order_title"
    Android:layout_width="wrap_content"
    Android:layout_height="20dp"
    Android:layout_marginTop="4dp"
    Android:text="@string/main_swipe_list_item_info_title_order"
    app:layout_constraintStart_toStartOf="@id/start_guideline"
    app:layout_constraintTop_toBottomOf="@+id/delivery_status"/>

Vous n'avez pas besoin d'avoir à la fois des contraintes de début et de fin ici, car vous utilisez des directives.

Notez qu'en général, HierarchyViewer ne vous donnera pas de mesures précises (cela dit, avec une telle différence, quelque chose semble mal là-bas).

Comment votre vue personnalisée com.express.mobile.customView.MyNetworkImageView gère-t-elle les mesures? lorsque vous le définissez sur 0dp, il sera également mesuré deux fois dans votre mise en page.

Enfin, pourriez-vous ajouter le contenu de votre mise en page incluse order_list_item_map_interval_box?

edit 1.1 beta 6 devrait améliorer les performances tout à fait un log

8
Nicolas Roard

Je crois que quelqu'un a posté dans un commentaire qu'une version non disponible de l'apk fonctionnera beaucoup plus lentement. Je viens de le confirmer sur ma propre application. La page simple se chargerait très lentement et un clic sur le bouton exécuterait l'utilisation du processeur jusqu'à 25% en utilisant une application de débogage. La création d'une version a résolu le problème.

ConstraintLayout doit communiquer fortement en arrière-plan, et ces journaux ou rappels sont probablement supprimés lors de l'exécution d'une version. Bonne chance!

2
indyman777

Je viens d'essayer ConstraintLayout 1.1.0-beta6 Les temps de mesure ont été réduits à environ 250 ms. En gros, c'est plus rapide de 40% mais loin d'être utile dans ma situation.

1
Kęstas Venslauskas