Mise en place d'une collapsing toolbar

Signaler
Messages postés
17
Date d'inscription
samedi 7 mars 2020
Statut
Membre
Dernière intervention
11 janvier 2021
-
Messages postés
14931
Date d'inscription
lundi 11 juillet 2005
Statut
Modérateur
Dernière intervention
11 janvier 2021
-
Bonjour,

Je suis en train de developper une application disposant de 3 activités dont 2 avec une toolbar classique, et la 3 ième avec une collapsing toolbar. voici mes sources :
le fichier manifest.xml
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.openclassrooms.entrevoisins">

    <uses-permission android:name="android.permission.INTERNET" />

    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:networkSecurityConfig="@xml/network_security_config"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        >

        <activity
            android:name=".ui.neighbour_list.AddNeighbourActivity"
            android:label="@string/activity_new_neighbour"
            android:theme="@style/AppTheme" />

        <activity
            android:name=".ui.neighbour_list.ZoomNeighbourActivity"
            android:theme="@style/AppThemeNoToolBar" />

        <activity
            android:name=".ui.neighbour_list.ListNeighbourActivity"
            android:label="@string/app_name"
            android:theme="@style/AppTheme" >
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>

    </application>

</manifest>


Le fichier "style.xml"
<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.MaterialComponents.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>

    </style>

    <style name="AppThemeNoToolBar" parent="Theme.AppCompat.Light.NoActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>
    </style>
    <style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />

    <style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" />

</resources>

Mon fichier layout avec la collapsing toolbar
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
    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/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:context=".ui.neighbour_list.ZoomNeighbourActivity">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/app_bar_zoom"
        android:layout_width="match_parent"
        android:layout_height="300dp"
        android:fitsSystemWindows="true"
        android:theme="@style/AppTheme.AppBarOverlay">

        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/toolbar_layout_zoom"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:fitsSystemWindows="true"
            app:contentScrim="?attr/colorPrimary"
            app:layout_scrollFlags="scroll|exitUntilCollapsed"
            app:toolbarId="@+id/toolbarZoom">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="@color/colorAccent"
                android:orientation="vertical"
                app:layout_collapseMode="parallax"
                app:layout_scrollFlags="scroll|exitUntilCollapsed">

                <ImageView
                    android:id="@+id/zoom_avatar"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    />

                <TextView
                    android:id="@+id/zoom_name"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_marginTop="5dp"
                    android:textColor="@color/white"/>

            </LinearLayout>

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                app:layout_collapseMode="pin"
                app:navigationIcon="@drawable/ic_baseline_arrow_back_24"
                app:popupTheme="@style/AppTheme.PopupOverlay"/>

        </android.support.design.widget.CollapsingToolbarLayout>
    </android.support.design.widget.AppBarLayout>


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

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/floating_action"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="5dp"
        android:src="@drawable/ic_baseline_star_border_24"
        app:backgroundTint="@color/white"
        app:layout_anchor="@id/app_bar_zoom"
        app:layout_anchorGravity="bottom|end"/>

</android.support.design.widget.CoordinatorLayout>


et la classe java associée à l'activité avec collapsing toolbar

package com.openclassrooms.entrevoisins.ui.neighbour_list;

import android.os.Bundle;
import android.support.design.widget.AppBarLayout;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.util.Log;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.ImageView;
import android.widget.TextView;

import com.bumptech.glide.Glide;
import com.openclassrooms.entrevoisins.R;
import com.openclassrooms.entrevoisins.model.Neighbour;

public class ZoomNeighbourActivity extends AppCompatActivity {
    private ImageView mZoomAvatar;
    private TextView mZoomNom;
    Toolbar toolbarZoom;
    Menu zoom_menu;
    AppBarLayout appBarLayoutZoom;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate( savedInstanceState );
        setContentView( R.layout.activity_zoom_neighbour );
        Neighbour neighbour = (Neighbour) getIntent().getSerializableExtra( "NEIGHBOUR" );
        Log.e( "TAG3", "nom : " + neighbour.getName() );

        mZoomAvatar = findViewById( R.id.zoom_avatar );
        Glide.with( this )
                .load( neighbour.getAvatarUrl() )
                .into( mZoomAvatar );

        appBarLayoutZoom = findViewById( R.id.app_bar_zoom );
        toolbarZoom = findViewById( R.id.toolbarZoom );
        setSupportActionBar( toolbarZoom );

        getSupportActionBar().setDisplayShowTitleEnabled( false );

        toolbarZoom.setNavigationOnClickListener( new View.OnClickListener(){
            @Override
            public void onClick(View v) {
                finish();
            }
        } );
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        this.zoom_menu = menu;
        getMenuInflater().inflate( R.menu.zoom_menu, menu );
        hideShowFAB();
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        int id = item.getItemId();
        if (id == R.id.favorit_zoom) {
            return true;
        }
        return super.onOptionsItemSelected( item );
    }

    public void hideShowFAB(){
        appBarLayoutZoom.addOnOffsetChangedListener( new AppBarLayout.OnOffsetChangedListener(){
            @Override
            public void onOffsetChanged(AppBarLayout appBarLayout, int verticalOffset) {
                MenuItem menuItem = zoom_menu.findItem( R.id.favorit_zoom );
                if (Math.abs( verticalOffset ) == appBarLayout.getTotalScrollRange()) {
                    menuItem.setVisible( true );
                } else if (verticalOffset == 0) {
                    menuItem.setVisible( false );
                }
            }
        } );

    }
}


A l'execution je plante avec le message :
java.lang.RuntimeException: Unable to start activity ComponentInfo{com.openclassrooms.entrevoisins/com.openclassrooms.entrevoisins.ui.neighbour_list.ZoomNeighbourActivity}: java.lang.NullPointerException: Attempt to invoke virtual method 'void android.support.v7.app.ActionBar.setDisplayShowTitleEnabled(boolean)' on a null object reference


Merci d'avance pour votre aide...



Configuration: Windows / Chrome 87.0.4280.88
.

4 réponses

Messages postés
14931
Date d'inscription
lundi 11 juillet 2005
Statut
Modérateur
Dernière intervention
11 janvier 2021
2 986
Hello,

Le message dit que, lorsque tu appelles la méthode
setDisplayShowTitleEnabled()
, ton objet toolbar est nul. Problème d'init peut-être ?
Messages postés
17
Date d'inscription
samedi 7 mars 2020
Statut
Membre
Dernière intervention
11 janvier 2021

oui mais que dois je faire pour initialiser ?
Messages postés
14931
Date d'inscription
lundi 11 juillet 2005
Statut
Modérateur
Dernière intervention
11 janvier 2021
2 986
Je pense qu'il y a une erreur ici :
toolbarZoom = findViewById( R.id.toolbarZoom) 

ça devrait être plutôt cci je pense :
toolbarZoom = findViewById( R.id.toolbar) 


Voici un exemple de mise en oeuvre :
https://www.journaldev.com/13927/android-collapsingtoolbarlayout-example
Messages postés
17
Date d'inscription
samedi 7 mars 2020
Statut
Membre
Dernière intervention
11 janvier 2021

Merci BunoCS.... problème résolu :tout à fait ce que tu as écrit. Bon maintenant il me reste à enrichir mon layout pour afficher plus d'info et puis surtout afficher dans ma toolbar une image dont je ne connais que l'URL


Aujourd'hui dans les tutos je n'ai que des exemples avec des images fixes et stockées dans l'appli ce qui n'est pas mon cas..... Sais tu comment faire ?
Messages postés
14931
Date d'inscription
lundi 11 juillet 2005
Statut
Modérateur
Dernière intervention
11 janvier 2021
2 986
Jettes un oeil à Glide ou Picasso, des librairies de téléchargement d'image