Move focus/navigate, with d-pad, between LinearLayouts in same fragment - android

I have a fragment containing several layout that I want to move the focus between. The app is operated with a remote containing a D-Pad (up,down,left,right & enter).
Both "view groups" are wrapped in a FrameLayout because the second one i overlapping the first one which is stretching the whole page. The views layout looks like this:
<FrameLayout android:id="contentSurfaceWrapper">
<HorizontalScrollView android:id="contentSurfaceScroll">
<LinearLayout android:id="contentSurface">
<!-- This layout is populated with child layouts (LinearLayout) programmatically -->
<!-- Those layouts are: clickable, focusable & focusableInTouchMode -->
</LinearLayout>
</HorizontalScrollView>
</FrameLayout>
<FrameLayout android:id="navButtonsWrapper">
<ScrollView android:id="navButtonsScroll">
<LinearLayout android:id="navButtons">
<!-- This layout is populated with child layouts (LinearLayout) programmatically -->
</LinearLayout>
</ScrollView>
</FrameLayout>
Image of how it looks:
I'm able to navigate to the view: contentSurface and between all its childs with the remote from the action bar in the top of the app. But, now I want to navigate from the first view (contentSurface) and its childs to the second view (navButtons) and its childs. But I doesn't seem to be able to move the focus some how. I want the focus to be moved when reaching bottom in the first layout and back when reaching top in the second layout.
I've tried to make the children in the second layout also clickable, focusable and focusableInTouch but it doesn't seem to work.

So.. I solved it this way:
For the first child in both views, which I append programmatically, I'm setting an ID.
This ID is then used with android:setNextFocusDownId on the items in last row in top layout and in android:setNextFocusUpId on items in bottom layout on first row.
This way I can switch focus in between the childs in both views.
More info about android:setNextFocusUpId etc.
http://developer.android.com/reference/android/view/View.html

Related

How to stop a textview pushing layout off of screen

I am building a app and I just need some help with the attached screen shot.
Currently I have 5 Plain Textfields with the last 2 being textMultilines. I have a Relativelayout with a button placed at the bottom for the user to press submit. The problem is when the textViews above are filled in, especially the multiline ones, it will push the Relativelayout and button off the screen.
How can I stop this from happening
Picture of layout
Either You should fix the height of multi lines text or you can simply use Scroll View and put all the text view and button in same relative layout
You can make them Scrollable by adding ScrollView around them.
like
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
//all your views here
</LinearLayout>
</ScrollView>

Animating layouts using the "animateLayoutChanges" attribute in XML

I have a LinearLayout, for which I apply android:animateLayoutChanges="true" in the parent LinearLayout. When the user clicks a toggle button, the LinearLayout "collapses" (I set the view's visibility as LinearLayout.GONE programmatically, and when they click it again, it expands by programmatically setting the visibility back to LinearLayout.VISIBLE.
The animation of it collapsing and expanding works correctly.
However, any items below the collapsable/expandable LinearLayout snap back to the top before the animation of the collapse is complete. The items that are snapping back are NOT inside the parent which has animateLayoutChanges set to true, and I don't think there is any way I can put them inside it.
Here is my layout hierarchy (I didn't mention the attributes to keep it short):
<!-- Top most LinearLayout-->
<LinearLayout>
<!-- LinearLayout containing android:animateLayoutChanges="true"-->
<LinearLayout>
<!-- RelativeLayout containing button to toggle LinearLayout visibility below-->
<RelativeLayout>
</RelativeLayout>
<!-- LinearLayout that has its visibility toggled -->
<LinearLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>
This entire layout is inserted programmatically into another LinearLayout (see below):
<LinearLayout
android:id="#+id/form_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<!-- This is where the previous XML layout containing the toggle-able LinearLayout
is inserted programmatically. -->
<!-- This button snaps back up to the top before the animation is complete. -->
<Button />
</LinearLayout>
I realize the problem would be solved if I added the Button that snaps up to the LinearLayout that has animateLayoutChanges as true. However, this isn't an options for a few reasons.
So is there any other work around?
Instead of using animateLayoutChanges try adding
TransitionManager.beginDelayedTransition(transitionsContainer); in your onClick method where transitionsContainer is parent of views that should be animated.
For example your parent layout is is
<LinearLayout android:id="#+id/transitions_container">
<!--add your widgets here-->
</LinearLayout>
And in code
final ViewGroup transitionsContainer = (ViewGroup) view.findViewById(R.id.transitions_container);
button.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
TransitionManager.beginDelayedTransition(transitionsContainer);
// do your staff with changing children of transitionsContainer
}
});
Check https://medium.com/#andkulikov/animate-all-the-things-transitions-in-android-914af5477d50 for details.
Just a thought... What if you remove the 'animateLayoutChanges' from the embedded layout, and add it to the parent layout (second XML)? I suspect that this would animate everything. You may have to set the property to true in code since you're programmatically embedding the layout.
Here's how to do it programmatically
Stack-overflow
Another option would be to use the .animate property programmatically on the button that snaps back
myButton.animate().translationY(floatYposition).setDuration(300); //300 milliseconds
for linear layout try to manually enable 'changing' transition too
look at this for frame layout.. try that for your linear layout..
https://stackoverflow.com/a/51116293/2719243

ListView inside two LinearLayout and scrolling issue

I have this structure
<LinearLayout
android:id="#+id/1">
<LinearLayout
android:id="#+id/2" />
<LinearLayout
android:id="#+id/3">
<ListView
android:id="#android:id/list" />
</LinearLayout>
</LinearLayout>
And I populate the ListView with some data. Well my problem is that the ListView becomes scrollable (while the LinearLayout number 1 fits the screen without scrolling), but what I want is this View to become full height and that the LinearLayout with id=1 becomes scrollable.
Inside ListView number 2 I have some TextViews, etc.
ListView's are scrollable by default if when the content is more than its display area.
However, LinearLayout would need to have a ScrollView in order to scroll.
Red Alert - You cannot use ScrollView and ListView together. You will end up seeing un-expected.
Alternate Solution: Prioritize what is more important to you, if scrolling the entire screen then add a ScrollView (provided your ListView items are static) else I will to wait to hear a good solution on this one. :)
Add ScrollView for ListView.
ScrollView will work for only one child view, so you have to add like this
LinearLayout
LinearLayout
LinearLayout
ScrollView
ListView...../ListView
/ScrollView
/LinearLayout

LinearLayout imageview doesn't fit on screen?

Hi I have a linearlayout and it seems that when I add a second viewflipper that holds two imageviews the second viewflipper is shown on the display screen very tiny. How do I get the linearlayout to allow me to add more views meaning even if I run out of linearlayout space I can just scroll and the linearlayout will show at the normal size.
For example when you go to a website on your phone you can scroll through the website until you reach the end of the page. I would like the same thing to work for my linearlayout.
Scrollview doesn't work/it only works for one child view.
Any ideas?
What is the problem having one child layout? How about this? ScrollView has just one child and doesn't care home many children its child has.
<ScrollView>
<LinearLayout> <!-- parent -->
<LinearLayout></LinearLayout> <!-- child 1 -->
<LinearLayout></LinearLayout> <!-- child 2 -->
<RelativeLayout></RelativeLayout> <!-- child 3 -->
</LinearLayout>
</ScrollView>

Can I make the entire activity scroll instead of the ListView?

I'm populating an activity with a ListView that sometimes exceeds the window size vertically. Instead of the user being able to scroll the ListView, I want the ListView to just take up the space it needs and let the users scroll in the activity instead. Is this possible?
Here is an image for clarification: http://imgur.com/1I2bc
On both sides there is a ListView containing 8 elements, only the right one takes up the space it needs to show the list fully though, pushing the other views down and making the entire activity scrollable.
You need to use the methods addHeaderView and addFooterView to add views before and after the ListView.
To add several views, first put the views in a Layout or ViewGroup and add that ViewGroup as the header or footer view (ViewGroup is a subclass of View).
-have you tried to put your scroll element as top level element in your layout .xml?
Something like this:
<ScrollView
android:id="#+id/scrollView1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
<ListView
android:id="#+id/listView1"
android:layout_height="wrap_content"
android:layout_width="fill_parent">
</ListView>
</ScrollView>

Categories

Resources