I have a project with 99 fragments. A client wants us to make our BottomNavigationView semi-transparent and have our content scroll behind it. But not all our fragments are scrollable. Some are RelativeLayouts with controls attached to the bottom of the page that need to not allow themselves to go down past the BottomNavigationView, so that they're not covered up. And even with the pages that scroll, sometimes it's not even the entire page that scrolls, but just a subset of it. Is there any way I can achieve this kind of ambiguity without going through all 99 of my fragments and making a unique judgement call on each or them?
There is no direct solution as such for what you are trying to achieve.
If your fragments has RecyclerView then add extra bottomSpacing for last item in the list in ItemDecoration class.
If your fragment has ScrollView then add extra paddingBottom for last view in the hierarchy.
If your view has anything other than these two scrolling views, then you can hardcode the bottom margin and give a color below matching to the navigation view. This make it look opaque from translucent.
One thing that is understood is the bottom spacing, margin and padding will be equal to or slightly greater than (ideally height + 8dp) you bottom navigation.
Since you fragments behave differently, there is no use of trying to make single solution for the same. But to make the job easier for future, you can externalise these margins and spacings in dimens.xml (use same object for all the spacing) and hence in future if any requirement changes, you can change the spacing directly from the dimens.
And you can do the same for bottom navigation spacing color, externalize to colors.xml and change it as you like.
Related
I am trying to create an activity layout with two parts, where their respective size is dynamic. The activity should have two states:
Starting state:
The user scrolls the bottom part up to the second state (and back):
It's important that the change will be animated. I tried a few solutions so far but didn't manage to find the exact way to do that:
AndroidSlidingUpPanel - The panel acts as another layout, covering the upper view and moving the toolbar out of the screen.
Android Split Pane Layout - Correct behavior, but the splitter is dragged and not the bottom part (I don't want to have a visible splitter).
CoordinatorLayout with CollapsingToolbarLayout - I didn't find a way to limit the upper part from totally disappearing. Anyway I think that it's a bit abusing because I don't want to collapse a toolbar but just change the children's height with animation.
Is there a good way to implement this using another library, one of these that I perhaps didn't use correctly or with simple layouts? Thanks!
I found a custom version of the SlidingPaneLayout created by VLC, which is basically a vertical SlidingPaneLayout - the exact functionality that I was looking for.
I am relatively new to Android UI. I always get confuse in providing margin to different view like should i provide bottom margin or should i use top margin(to view below it). Also should i use RelativeLayout or LinearLayout if both can solve my problem.
Thanks
It Depends on your need
Linear Vs Relative
If you just want to stack your TextView and Button horizontally or vertically you should go with LinearLayout.
If you want to make a layout that is more complex for example you can have an ImageView covering all of the screen and Button over the ImageView or if you want your layout elements to be stack on corners or at bottom, RelativeLayout is your Guy.
Top margin vs Bottom Margin
It doesn't make much a difference its a personal preference, I Use margin-bottom on first element rather than margin-top for second element.
One noticeable difference is when you are working with Show layout bounds during development. You can see here those pink coloration indicate that it is using margin on its view while padding has no coloration. Recently I prefer to use padding if applicable with my requirements as it seems more cleaner to inspect UI when Show layout bounds is enabled from Developer option.
The image is not mine and was just use as a quick sample.
If both Linear and RelativeLayout will solve your layout, then you should use Linear as it is faster to render.
With regards to top vs. bottom Margin. That's entirely your preference and how you want to think about the elements. Does Item A always sit 40dp above the next item or does Item B always sit 40dp below the previous item?
My view hierarchy: (left image)
GreenTextField in RedFragment in BlueFragment in BlackFragment
I need to have the GreenTextField go over parent fragments bounds like the image to the right.
I have tried with negative margin, but I doesn't work.
Any suggestion about how to solve this?
This fragments layout is needed and this sample is simplified a lot.
Result: As expected this is not really possible.
First, if there is a chance to use ViewGroups instead of those nested Fragments, you should think about redesign. It would be crazy to maintain such code :)
But if you really have to keep this structure, try something like that.
Set android:clipChildren="false" to all parents of GreenTextField.
This works for layouts, but it could not work for Fragments, so see here.
Calculate GreenTextField's width and set it (of course programmatically).
Make your GreenTextField draw on top, over right blue part. There would be no problem if the blue structures are inside RelativeLayout, but probably they are not. Then try with bringChildToFront(View child) from ViewGroup.
This is impossible.
This is not the purpose of fragment(as independent ui element) and fragments' child view can't exit its parent limits (width and height)...if it is, its a design flaw.
In order to do so you sholud put the black fragment and the textField in a relative layput.
textfield height issues -> change it dynamically on onViewCreated method, of the left red fragment, in order to place it on top of its position.
another solution is to put the textField under the black fragment, and set its position dynamically.
Set to the black rect to be a parent of the green. Calculate offset manualy.
Ok, I have a LinerLayout vertical in which there are three fragments, lets say: HeaderFragment, SubHeaderFragment and ListViewFragment (fragment with listview in it). These are put in the layout in this order, width set to match_parent. The header and subheader fragments have a defined height, lets say 100dp each. The list fragment's height is set to wrap_content.
Now, what I want to do is that when the list fragment is scrolled down, the SubHeader fragment should loose its height (according to the amount scrolled) until it disappears and the user checks the list. If the user scrolls back up to the beggining of the list the SubHeader fragment should get its height back, again according to the scrolling.
This can be seen in several Apps, for better use of the screen size.
I have researched quite a bit, but I found no simple solution to this. One would be to keep track of the scrolling position of the list and reset the heights dynamicly while this is done. Which is trouble because as far as I know the scroll position for the list must be calculated and I am dealing with fragments that have no layout params.
Another idea I had was to put the SubHeader and the List Fragments in a scrollview within the linear layout, but that destroys my list within its fragment and people say it shouldnt be done due to bad performance.
Is there a decent simple solution for this? Thanks for any help in advance!
Seeking help to design a layout as shown here:
http://docs.google.com/Doc?docid=0AQhgDtGvE2HgZGZ6cmtua185MTd0eGdyZmc&hl=en
The major challenge I face is aligning the components at desired positions. Please refer the three buttons(icons) and the way they are positioned.
Literally, going nuts, thinking how to position those exactly at the desired places.
Any help is much appreciated.
Regards,
Rony
Since you used the Android category, I'm assuming that you're trying to recreate this iPhone layout in Android.
The three buttons would probably be best laid as follows.
Your main layout container would probably be a RelativeLayout, so you can dock things to the top and bottom and lay everything else out in relation to one of its sibling elements. The three button icons (and I'm assuming you're referring to the circular buttons and not the tab bar buttons at the very bottom) would be in a LinearLayout centered within its parent (probably want to use gravity=center_horizontal on the main outer layout) and the individual items would have an equal left and right margin parameters to get the desired spacing (layout_marginLeft, layout_marginRight). You could also make the LinearLayout container of the buttons flush (layout_width=fill_parent) and using android:weight attribute on the outer buttons laying them out towards the center and using a lower weight on the center item. I'd favor the first option, personally.
If you're trying to create relatively complex layouts and any of the above doesn't make sense, go back and read the docs. Layout in Android is very powerful, but you really have to understand the available tools to take advantage of it.