Android WhatsApp style floating header view - android

If you are familiar with WhatsApp, when you start scrolling, a view with the message's date slides down from the top of the screen. I'm trying to achieve something like that, my view is the top most view with decreased alpha and blue background, just below the ActionBar.
I did not use a ListView, below the ActionBar I have a ScrollView, and inside that ScrollView I have a LinearLayout.
I add my messages to this LinearLayout.
I could not figure a way out how to know if the date changed and need to refresh my header view.
I tried to get their positions on the screen with the
activityRootView.getViewTreeObserver().addOnScrollChangedListener() but this doesn't get triggered if you scroll fast.
Setting an onTouchListener to the ScrollView didn't work either, as the scroll may continue after I release the touch event.
It's been a long week and I'm out of ideas.
I'm open to any suggestions, thank you.

You can look at the Standout Library , you can handle floating windows with it.
You can also create a semi transparent activity / dialog.

Related

Layout with scrollview: how to reach the bottom as fast as possible?

I have a minor problem which i can't solve.
I have a layout with scrollview embedding a lot of views.
Everything work fine with the android studio preview in design mode but when i want to access to a view at the bottom, i have to scroll the mouse wheel very long time in order to reach the bottom of the layout. So it works but as soon as i make a change of the view located at the bottom i have to scroll the mouse wheel very very long time so:
Is there a shortcut to go to the bottom of the layout or something else?
Even if i click on the view in the component tree window beside the preview, it selects the view but doesn't displays it.
Thank you.

Android - Click Toolbar that is overlayed by a view

Here's my current situation: I can't click on the toolbar because there is a view that is overlapping it intercepting the touch responses. I'll expand: I'm making a music app. In the music app, there is a list of songs that is beneath the toolbar. However, once you click on a song, a panel opens up and slides up over the toolbar and continues into a transparent status bar. Pictures of this will be attached.
Now, obviously because this view is overlapping the toolbar I cannot actually use the toolbar for any touch events. But I need to. I cannot move the view below the toolbar because then my sliding up panel is limited to beneath the toolbar instead of overlapping it. If there is anyway to get around this, please let me know. I'd very much appreciate it.
So, in my current situation, I thought maybe I'd be able to touch the portion of the view that covers the toolbar and send that data to the view that contains the toolbar so I can detect touches on the toolbar. However, I cannot figure out how to do this, or even if it is possible.
My question is: How can I detect touches in the view beneath another view?
Here are the pictures:
Here is the list of songs:
And here is when the song panel is opened(I'm using an image of a tiger for any song that doesn't have art at the moment):
Thanks!
wtf?
You want that your user can touch on the toolbar which is not visible at the moment because its overlapped by another view? What kind of user would expect such a user experience?
I mean:
How does the user even know that he can click on a not visible element ^^
If the user magically knows somehow that he can click, how does he know where exactly he has to click. For example, he could also click on one of the toolbar menu items, but if he clicks a few pixel more left, then he would click on toolbar item 1 instead of toolbar item 2.
However, you have three possibilities:
You can make the overlapping view not clickable by overlappingView.setClickable(false);.
You could add a transparent view with an OnClickListener that has the same width and height as the toolbar over the overlapping view. In the OnClickListener you could simply invoke the desired method like onOptionsItemSelected() (fake the required parameters) or use an EventBus for communication.
Similar to the 2. option add a transparent view, but instead of setting a OnClickListener set a OnTouchListener by extending from View) and forward the MotionEvent to the Toolbar by calling toolbar.onTouchEvent(motionEvent);
If you really want to detect touch events of a view beneath another view you could set onTouchEvent of the foreground view to false. However, I advise you to rethink the layout in order to put the Toolbar on top so the users can see it otherwise they don't know what they are clicking on.

Trouble in views on android with onclick at RelativeLayouts

i'm having the next problem.
I have two layouts, one behind the other. When I click on the first view the "click" pass trough the view and it arrives at the second one. How can i stop the onclick only for the first view and enable it when i want at the second view?
Thanks in advance.
EDIT
A image with my problem
2EDIT
Why am i doing this? Because i put im my app a menu like facebook. So i have the menu in the red view and i animate the green to the right to see the complete menu. See http://venturebeat.com/2011/12/07/facebook-for-android-upgraded-with-better-navigation-faster-photo-views/. Seems that the solutions is with set the view clickable to false.
It's not clear what and how do you want to achieve, but it doesn't seem to be a good idea to have RelativeLayouts on top of each other. For this you could use a FrameLayout, or if your layout is a bit more complicated, you could play with setting the views unclickable.
If this doesn't help you, please post some code.
EDIT
It's still not too clear why do you want to achieve this, but you can set the second view unclickable, whenever you want.

Android: Add image on top of each item in a listview

Does anyone know if it is possible to layer an image over the top of each item in a listview? To indicate that each list item is clickable, I'd like to add a small right-pointing arrow on the extreme right side of every item in the list. I'd like this image to scroll with the list.
I know that I can just create a horizontal linearlayout and put the image there, but this takes up some of the screen. I'd rather have it "floating" over the top of each item. Hopefully I'm making myself clear.
Thanks!
Short answer: don't do this, it directly contradicts Android UX guidelines, http://developer.android.com/design/patterns/pure-android.html
Long answer: post your xml/code for building the cell. It's probably enough to use a RelativeLayout and align an ImageView to its right side.
Again, this is completely unnecessary and an anti-pattern on Android. Don't do it.

Android - keeping a single element contained on screen

I'm experimenting to see if the layout scheme I want to use is possible. I want to have an XML layout that's scrollable. Within that scrollable layout, I want to have a single line going horizontally across the screen (I used just a View with a fixed height and different color). When that horizontal line reaches the top of the screen, and as I scroll down through the layout, I want it to stop and remain at the top of the screen while being able to scroll through everything below it.
I've been messing around in XML trying to get it to work, basically putting a bunch of junk before it and after it.
Any ideas as to how that might work? Would I have to do something fancy with the java code to fix the red line at the top when the scroll position reaches a certain point? Your help would be greatly appreciated.
I am assuming you want something like Gmail app where when you scroll a mail the header sticks on top... To do this, you need 2 views. You have your regular scroller below and overlay a fixed view on top (you can use a relative layout to do this). When your cell goes past a certain spot, you want to populate and set the visibility of the fixed view to VISIBLE. This would give the impression that the view you want to 'stick' to the top really just got stuck rather than scrolled out of view. You'll have to work out the opposite scrolling scenario too based on the location and height of the scrolled cell/view.
HTH

Categories

Resources