How did you fix the behavior where scrolling down hides the title/search orb in fragments with multiple rows?

[ghost]

Thanks for your great blog posts and samples. I noticed that in your Musixmatch app, the fragments that contain multiple rows automatically hide the brand logo/search orb and fill the full vertical height as you scroll down. In this sample, though, those elements remain shown at the top and the rows scroll in the viewable area below them. What did you do to fix this behavior?

[dextorer]

Thanks @sciencepro !

To do this, you need to take into account three conditions: the header's state (whether it is collapsed or not), the selected item on the header and the selected row on the content. Now, follow this flow:

1) If the header is open and its currently selected position is the first one, then show the search orb; plus, if the currently selected row on the right is the first one, show the logo as well. 2) If the header is closed and if the selected row on the right is the first one, then show the search orb and show the logo. 3) Otherwise, hide the search orb; if the currently selected row on the right is the first one, show the logo as well.

To determine the position of both the header and the content, you can use the getVerticalGridView() method.

[ghost]

@dextorer Thanks! That helps a lot. What's your trick for adjusting the padding on top of the rows fragments? Setting the views for logo and search to GONE isn't enough on its own as the Row fragments start off with 128dp padding up top (setting it to 0 immediately on hiding the logo/search causes the scrolling to mess up somewhat).

[ghost]

FYI I think I found a good solution - set padding on the VerticalGridView in the CustomRowsFragment, not the fragment's View itself. Seems to work perfectly. Thanks for the great resource.

[aungthanlwin]

Hi @sciencepro @dextorer , I'm implementing an app based on this Sofa Framework, I also found some issue like this one (not hiding title and search orb) and the back button not working if we return from Rows to the Header.

For the Back Button, the following code in the Main Activity will solve the issue as a workaround solution.

@Override public void onBackPressed() {

    if(!isNavigationDrawerOpen()) {
        toggleHeadersFragment(true);
        headersFragment.getView().requestFocus(View.FOCUS_LEFT);
    }
    else
        finish();
}

If you don't mind, could you commit the changes for this implementation for hiding orb and title bar when moving to second rows as the current latest code is not updated with the solution provided by @dextorer . Thanks. I will try to update useful things while I'm working on my app.

[dextorer]

Wait, this is not Sofa, this is just a demo project that I've made for tutorials. For Sofa-related issues, please open a PR (which is extremely appreciated) on the appropriate project: https://github.com/dextorer/Sofa

[aungthanlwin]

Thanks @dextorer. Sofa has handled this issue.