Android: nested links inside of clickable layout - android

Here's scenario:
I have a RalativeLayout holding ImageView and few TextViews.
There are "linkified" elements inside these TextViews such as URLs, phone numbers, etc.
Clicking on the links result in various actions, also clicking on ImageView triggers some action too.
Now - I want to have outer onClick attached to the complete area of RelativeLayout in such way that if user clicks on any spot withing the layout (but outside of the image and links) then it executes another action
Right now I have layout#onClick, image#onClick, and embedded links are processed by Linkify. Image and links clicks are working reliably but clicks on layout are captured about 50% of the time and I suppose would frustrate users to the point of tears. Any tricks that you guys can suggest to improve reliability? And if not what would be a good way of achieving this from the best usability standpoint?

Since no one came out with answer at least I can share my thoughts about the solution. Basically I decided not to fight overlapping click handlers and instead, start with onClick enabled on the parent. Then, when the parent detects the click it turns it's own focus off and lets other controls take care of clicks. I also added "Off" button that is visible only when parent is expanded and clicking on that collapses the parent and puts the focus back into the parent view.
Let me know if you know better solution

Related

how to make a button fold down two EditTexts below on click

I'm a beginner with short knowledge of programming, I've just started learning android development. I'm making an app and at one of the pages I have to make a certain kind of design that I cannot figure out how to or can't even find them in the internet. Basically, as you can see in the images below, next to the first textview, there's a little arrow. Whenever the user clicks on that arrow, two edittexts should appear below that texview just like in the second image and kind of drag the rest of the textviews down. I'd be really grateful if you guys could help me do this or at least provide me with some information on where to search this kind of problem solution. Thanks.
Just create your desired layout in xml with 2 edittext below each textview. But make sure You take these 2 edittexts in a single container. Lets say LinearLayout.
Then you would be easily able to show/hide these lineralayout based on the TextView click.
Or If You are using recyclerView, then it would be more easy. In this case, You have to show the 2 edittexts for currently clicked item only and will need to hide for all others

Leanback.DetailsFragment not scrolling as expected

I have a details fragment that is using a DetailsOverviewRow and FullWidthDetailsOverviewRowPresenter. When the page first loads the action buttons are selected. When I press down once, focus leaves the buttons and nothing else happens. When I press down a second time focus moves to a ListRow that is further down the page. I'm trying to figure out why the overview, or body as it's called in the presenter, section doesn't focus.
Should there not be a second 'state' between the two screenshots where the overview/body is readable?
Possibly of note. The DetailsFragment isn't declared in an activities xml, I'm changing fragments manually using FragmentTransactions. Also, the Fragment is instantiated using a static create method (source below).
Thanks in advance.
Activity xml
DetailsFragment java
I haven't tried this example in particular, but from my time spent with Leanback support library, I learned that even though a lot of helpful stuff is indeed provided, a lot is not :D
So I would try these things:
1) Make sure that something in the area you want visible is focusable. (Clickable elements should be focusable by default, but better check too) What I mean is that on the screenshot, there is just text, no buttons or editable content in that area. So when you press down, there is nothing to focus. What happens if you make the body TextView focusable?
(Yes, one would expect that the support library would take care of that, but that might not be the case.)
2) Find out what actually gets focused when you press down, since as you said, the focus leaves the buttons - but where does it go? (How to find out which view is focused?) You might have a "direction problem" somewhere. That is - the focus travels based on the view hierarchy tree, not based on what we see on the screen. In some cases, it is possible to skip some elements or get stuck somewhere by moving focus through an unexpected part of the view tree, that makes sense for the algorithm, but isn't logical from the human perspective.
The details presenter focus works this way :
1) First focus is given to Action buttons. Right/left nav press shifts the focus right/left between action buttons.
2) Down nav press from actions row shifts the focus from actions row to details row (individual details items itself are not focusable), this is achieved by shifting the Thumbnail anchoring position to further south.
3) Down nav press from details row shifts the focus from details row to related row.
So the details row gains focus by changing the anchoring position of Thumbnail image. Is your thumbnail image changing its anchoring position when pressing down from actions row?
Hate to answer my own question. This was due to my failure to RTFM. I was creating the fragment UI after a network request completes. For the FullWidthDetailsPresenter to work properly it and the ClassPresenterSelector() should be initialized in the fragments onCreate() method.

Replacing views dynamically without changing activity

I would like to know how to go about doing this small problem that I am encountering while making a video player app.
On clicking the first control(the rectangular icon) in the above image the following view must be displayed instead of it which I am quite unsure as to how to do it. Here is what it is replaced by
Also please note, by any chance the activity should not be changed. I have been able to design the views individually but having problem changing them at runtime when user clicks. Could someone go about explaining as to how it can be done or provide some suitable links to achieve my goal. Thanks.
For something as simple as this you can just change the visibility of the views.
view.setVisibility(View.INVISIBLE)
Or the more effective:
view.setVisibility(View.GONE)
Do that on the views you want gone, I suggest a wrapper class. It's either this or changing the contentView as describded below.
this.setContentView(R.layout.newLayoutToUse);
However, I have a feeling there is a better way to do what you want. It's overkill to load a complete new layout if you just want to change the image of some buttons or imageviews.
This might be a stupid solution, 'cause i'm terribly tired right now, but why not use the bringToFront() method on the View that you want to display in the front? Display them both in front of each other, maybe in a RelativeLayout, and then swap between them as you wish.
They are small objects, so don't consume memory. I don't see why this shouldn't work.
OR
Place them above one another, so they overlap and then make the above view visible/invisible depending on which one you need to display.
OR
just remembered I read somewhere that you can scroll through a ScrollView automatically from code. So display both Views in a ScrollView in succession and when pressing the button or whatever, you scroll down to make the next menu visible. When pres back, you scroll up to make the previous thing available. Should work, and might also make a nice animation between changing of the menus.

Any better approach for layout design?

just wondering if anyone else has a better suggestion that what I'm coming up with.
The issue is to do with a TabLayout, 5 Tabs all using a single Activity. Each Tab layout contains quite a few fields so the main parent on each tab is a ScrollView.
What I currently have is a 'Save' & 'Cancel' button sitting outside the scrollviews so theyre always visible and there for the user regardless which tab they're on. The problem is that since I'm using Tabs and always have these buttons visible when they are editing and the IME is displayed, they'res barely any of the form visible.
So I think the best thing for me to do is to probably show the buttons at the end of each scrollview. What I don't like about this is as I have 5 tabs, it will mean I have to declare 5 sets of the buttons, and of course define them and bind them in the Activity.. which seems rather messy and inefficient.
So if anyone has any better ideas I sure would love to hear them :-)
Thanks
Rgds,
Dave
Some of the options you got is
Try to put a title bar, and move the save and cancel buttons there (Small image buttons).
Save can be moved to the menu too (not recommended).
Auto Save functionality can also help, depends on how useful is it to you.
Try to use custom images for tabs, and make it take less space.
else, remove the save and cancel buttons, after the user makes any modifications, and presses back, prompt him to save the unsaved changes.
You could make it that when you're in tab X, the tab button for tab X now becomes X(save), so if they click again on the tab button in the same tab, it saves. That saves you five buttons, potentially...
Define programmatically the buttons inside a LinearLayout and add them to each ScrollView with addView. The code of the buttons should check in what tab are we at that moment, and act accordingly.
Then you'll have the same two buttons arranged in the same way in all your ScrollViews.
Or, if you dislike doing it programmatically, do a layout for the buttons and use View.inflate of that layout, and add them via addView to the ScrollView.

ViewFlipper caching issue

The views are not cached in a ViewFlipper. Is there a way wherein we can get an image of the view and show it to user so that he sees the Ui as we see on Home scrren(when we swipe the previous view also moves along and when we lift our finger, only then the next view is shown completely.)
What I want to do is that when the user starts moving his finegr on screen, the view should also move along(create an image of view).
I am not getting to do this, as when we swipe the present view goes and next view comes, we do not get both visible when we r moving our finger on screen.
Please if anyone gets what I am trying to do, do help me.
Thanks,
Farha
It's tricky to get scroll and swipe tracking working on Android, while using ViewAnimator or its subclasses.
They allow you to set in and out animations and start them at a given moment, but they work with discrete, either-this-or-the-other-view animations. They are actually using FrameLayout and after in or out animation is executed, other views' visibility is set to View.GONE to hide them from showing up under/over your current View.
The Launcher and the Gallery application are actually doing the functionality you want, by using a different approach.
They track the user touch input (onTouchEvent()), on MotionEvent.ACTION_MOVE they perform animations manually and on MotionEvent.ACTION_UP snap to the appropriate view, just like in the iPhone.
Unfortunately, this approach is actually more complicated than it looks like.
With the manual handling, you have to ensure that you are taking care of everything related to the touch input. This includes a lot of flag-raising, value-checking, event-delegating, etc.
If you want to get better acquainted with this, take a look at these classes from Gallery3D or Launcher's source code.
One other way to get nice horizontal scrolling is to use HorizontalScrollView.
You have to figure out a way to recycle your views, like you would with a ListView and you have to add the snap-to-view logic, but if you have to take care of a small number of views it could be the easiest approach.
Hope that helps.

Categories

Resources