"sticky headers" on the left side as in Lollipop's Contacts App

[s0nerik]

I wanted to create a list like in the Lollipop's "Contacts" app where sticky headers are the letters drawn on the left side:

I made a header view with transparent background and found that the original (not sticky) header is still visible behind the sticky one. Here's how it looks:

Is it a bug or should I somehow hide the original header myself?

[gsalgun]

I have achieved a workaround by calling setHeader(null) of ISectionable list item right after addItemToSection(item, sticky, position)

[davideas]

It should not be a bug since the sticky header is implemented to be displayed on new line and not on same line. However, this kind of inline header should be a new feature, when will be done I don't know.

[s0nerik]

Sorry for such a late response, but setHeader(null) didn't help me (the reason might be that I use linkHeaderTo instead of addItemToSection). Also, I was actually able to get really close in working around this limitation by using the negative item margin that in turn made the original header almost unnoticable (only if text color isn't fully opaque) and made it behave exactly like in the Contacts app. So for everyone who might need a quick way to implement such a behavior - just use the negative margin of the same value of your header height and set a text color to a fully opaque one.

[davideas]

@s0nerik, good! Can you provide the xml examples for the others? I guess you also used a custom frame layout for header holder?

[s0nerik]

Here's a header layout I used to accomplish Contacts-like look:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="56dp"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:gravity="center_vertical"
    android:orientation="vertical"
    android:layout_marginBottom="-56dp"
    >

    <TextView
        android:id="@+id/text"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:paddingLeft="16dp"
        android:paddingRight="16dp"
        android:text="A"
        android:textSize="20sp"
        android:textColor="#333"
        android:gravity="center_vertical"
        />

</LinearLayout>

Also, I didn't use any custom frame layout for a header holder, just the one that is provided with the library.

[aperfilyev]

@davideas hi! any improvements on that? negative margin in xml doesn't seem to work for me.

[davideas]

@aperfilyev, personally I didn't try, need more customization. Anyway, I have fear it will not be possible with the current version. HeaderItem occupies a line, while in Contacts App, header seems to be part of the first item. All items need a start space where the letter can be translated sticky.

As I imagine it now, it seems necessary a new SideStickyHeaderHelper, to write from scratch (more or less). OR, we can identify the first item still as a header, but only part of it will be translated, to specify in a new option which is the viewId to translate, by default the container will be translated as it is now.

[aperfilyev]

thanks! this library can do it but it doesn't seem to work with search view at all

[davideas]

Ah SuperSlim, yes I know it. The project is not dead he said, but it is almost abandoned as we can see. That LayoutManager is quite complex and it handles only sections. However, I cannot use any of that code because it is a LayoutManager, while mine is on the Adapter.

I will try in the next weeks to check what I can do on this, if it is feasible I will reopen this issue.

[aperfilyev]

Thanks! I will try to look into it on the weekend as well.

[davideas]

The key method is this StickyHeaderHelper.ensureHeaderParent()

[hayahyts]

Hello guys, has there been any development? I really need this

[davideas]

@hayahyts, I checked and did some commits in the branch lateral_sticky_view, but it is far to be considered "working"! It is quite difficult to adapt to the current code. It indeed requires more effort and time. Maybe another Helper class dedicated for lateral sticky would be better. I reopen this issue for the time being, but cannot work on it now.

[hayahyts]

@davideas thank you for your time. Will love to hear from you if there is any updates

[longnguyencmg]

hello, any update on this enhancement? Thanks!

[salismt]

@s0nerik could you give me a complete gist code on how to achieve this? or a full working screen maybe?

[salismt]

@davideas or is there any hack around for achieving the side sticky header? maybe a full gist code

[davideas]

No updates or suggestions about this sub-feature. What I wrote on 28-mar remains valid.

[Dwite]

@davideas hello, any update on this?)