user_4685247
user_4685247

Reputation: 2995

Name of the layout or how it's done?

In short I want a preview similar to Google Plays, where you can slide up and the top image/video preview fades back and the rest of the view is moved up.

Preview

I've got a view that I want to be hiden like the video in this example, the action bar can remain stationary at all times, but I need the bottom part to be dragable.

I can't seem to find out which layout that is, or how it is done, all I managed to find were unrelated such as ViewPager. My current min sdk version is 18, the compile version is 21.

Upvotes: 1

Views: 280

Answers (1)

Mohammad Arman
Mohammad Arman

Reputation: 7065

The following is the code I used in the app I am working

You will have to use the OnScrollChanged function in your ScrollView. ActionBar doesn't let you set the opacity , so set a background drawable on the actionbar and you can change its opacity based on the amount of scroll in the scrollview. I have given an example workflow

The function sets gives the appropriate alpha for the view locationImage based on its position WRT window .

this.getScrollY() gives you how much the scrollView has scrolled

public void OnScrollChanged(int l, int t, int oldl, int oldt) {
    // Code ...
    locationImage.setAlpha(getAlphaForView(locationImageInitialLocation- this.getScrollY()));
}


private float getAlphaForView(int position) {
    int diff = 0;
    float minAlpha = 0.4f, maxAlpha = 1.f;
    float alpha = minAlpha; // min alpha
    if (position > screenHeight)
        alpha = minAlpha;
    else if (position + locationImageHeight < screenHeight)
        alpha = maxAlpha;
    else {
        diff = screenHeight - position;
        alpha += ((diff * 1f) / locationImageHeight)* (maxAlpha - minAlpha); // 1f and 0.4f are maximum and min
                                            // alpha
        // this will return a number betn 0f and 0.6f
    }
    // System.out.println(alpha+" "+screenHeight +" "+locationImageInitialLocation+" "+position+" "+diff);
    return alpha;
}

You can download an example working sample at https://github.com/ramanadv/fadingActionBar

Credit: CommandSpace

Upvotes: 2

Related Questions