Bottom Panel in Android - android

I'm trying to design an app with a layout that will roughly look like this (don't mind the color):
How can I achieve something like that? I'm thinking of using a CardView for that bottom panel (I don't know what it's really called).
Furthermore, I want to hide it (animating it) when the use scrolls on the content. I have tried many codes but they won't work so I won't put them here anyway (like what's suggested here). Thanks for the help.

Whenever I have a question along the lines of "How do I do this neat UI thing I saw once?", I always start by checking out wasabeef's amazing UI library collection. In your case I might start by looking at bottomsheet or AndroidSweetSheet.

Related

An elegant way to keep integrity of RelativeLayout when animating it?

Ok, so...
I know, there's been a real amount of questions about it, but it either didn't work, or was really fixed in a hard way. Oh, and that's my second day trying to do it, so please, accept my apologies about that and help me for Chet Haase's sake.
I have a button on top of a fragment, and a RecyclerView below it. When i press the button i want it to disappear and a new RelativeLayout with textfields to slide from the top.
I don't want to make it with animateLayoutChanges="true", cause it's not exactly what i was meant to do, and i want rather learn, than do it.
I tried to do it with widget.animate().translation... and the result was that one widget was just thrown in it's place when the rest of layout stood still. That's not what i meant to do.
I tried also to make an "new TranslateAnimation" since it has this "setFillAfter/Before" attribute... but that did not help me neither.
What i tried as well was to update the layout somehow adding to id margins and stuff (don't remember anymore, and i'm in work right now trying to figure it out, sorry) as it was described in some questions.
But none of that worked. I don't include code right now, cause i already tried to do it in some dozens of different ways.
Could you please tell me how to move a widget and make the rest of them to move with it? Is it possible?
I've already got it going once using setVisibility,animateLayoutChanges and animation combination, but that was massive and dirty as a baby duck.
Edit: oh, i almost forgot about it. Another problem is that when i animate/move a widget, only the rendering spod changes, but the real spot of it stays the same (ex. a onclicklistener)
Ok, me again.
I did it this way, that - let's say - i want to slide a button up and remove it.
So i animate it and all the other widgets (right, i can make a ViewGroup) up, put a listener on animation, and on "onAnimationEnd" i clear all the animations and set the visibility to GONE.
The animateLayoutChanges must be set to false
Still it's not what i wanted, so i'd be indebted to anyone who shows me another, better way.

Need help figuring out how to implement UI

Essentially I'm asking what techniques to use in Eclipse/Android Studio to make a UI that looks like the FaceBook UI withtabs on the bottom and their typical action bar on the top with content in the middle.
I've been kind of dealing with this issue for quite some time now and as I have a project deadline coming up figured it was finally time to get stackoverflow's opinion. What would be the best way of creating a social media app that models FaceBook's user interface. By this I am referring to something with the four tabs on bottom and search/back and profile buttons at the top, with some sort of fragment changing in the middle.
The solutions I have currently tried are using a split actionbar by forcing the top into a custom layout and the bottom into an options menu; however, this resulted in giving the options menu the drop down option instead of tabs (if there's a quick fix for this like setting a custom layout to it please lmk because this is my current setup).
For the main content view I originally tried using fragments and then switching between fragments by using functions and buttons inside the fragment class to switch views; however, this required childfragment manager, and for some reason that never worked properly, so instead I ended up switching activities instead of fragments which was horribly slow.
If you guys have any suggestions on how to do this properly please please either tell me how I would go about this, or better yet please show me some very good examples on how to do these things.
Thanks :)
u can use any proto typing tools to create UI . Some tools include Proto.io , Fluid ui etc

building an Android Status Bar like the New York Times app

The New York Times Android application has something like a notification bar at the top.
I suspect this is an included layout with a text view. The thing is that they managed to drag that title down in order to present the top news.
Can anyone give any insight on how to replicate this?
Edit:
Yes the drawer was the solution to my problem nevertheless i needed one as New York time and the default SlidingDrawer are meant to only go bottom to top... so i looked over on St Google and got a nice Custom Componente Sliding Drawer, get some difficult to make it work as i need it but you can follow the case in Layout positioning problem with Custom SlidingDrawer
I think what you're looking for is a Sliding Drawer.
http://developer.android.com/reference/android/widget/SlidingDrawer.html
edit:
the link I post is good for the documentation, but might not give a full idea of what is actually happening. A good place to find an example might be here:
http://techdroid.kbeanie.com/2009/08/android-sliding-drawer-example.html
They have most likely just used a TextView as you said. Moving it down can be done in multiple ways. The simplest is just to have another view or view group in top of it and initially set its visibility to gone, and then to visible when you want to show it.
Sorry, i misunderstood what you meant. Since the top element was so small, i simply thought you meant you wanted to expose a element on top of the other element. Ill up vote the other answer since this is most likely what you are after :)

Android clickable panel UI

I am currently working on an Android app, I have completed all the 'hard stuff', such as getting my database working, and so on. Now I need to make the UI look decent.
I would like to make something that has a 'frame' layout that is clickable. You would click on a 'frame' to find out more information, a bit like the Amazon app.
If anyone has any ideas, tutorials or good links, I would be very grateful.
Thanks in advance.
Take a look at Gallery. It's built in to Android and does what I think you're looking for (at least, it describes the Amazon app's UI; since FrameLayout has a very explicit meaning in Android that is not at all what you're talking about, I ignored that part).
EDIT: A screenshot would have been helpful but I think you're actually talking about a simple list-like view.
Oh. That's either a ListView, or more likely just a vertical LinearLayout inside a ScrollView. I can tell you what I'd do: Each item in the LinearLayout would have a background set, with a width of match_parent and a height of wrap_content, using a 9patch with the right-pointing arrow inside it. I'd also define an identical but blue-highlighted version of the image for the pressed state and use a state drawable XML to let it know which to use. Then I'd just bind an onClick listener for each item I wanted to fire off a click action on.

Which Android control to use?

I'm taking my first steps in Android programming.
My application is to create entries in a database. For this task I have created a new Activity. All is fine - but I don't really like how it looks.
Currently, the emulator shows this:
I'd like to have something similar to the "New Contact" Activity:
Buttons at the bottom of the window, not directly below the other controls (I'll hopefully figure that out myself)
Buttons within a nice "box" like shown in the screenshot (what's the control hosting the buttons here?)
When soft-keyboard is displayed, the buttons should "move up". If there's not enough room, the entire area should be scrollable (I'll try and figure that out myself too)
Sample can be seen here:
Which control hosts the buttons in the above "New contact" screenshot? I'd like to use the same for my buttons.
One way to figure out what an existing activity does is to use hierarchyviewer and examine the activity's contents.
Another way to figure out what a native Android activity does is to look at the source code. In this case, it would appear that the buttons are inside of a horizontal LinearLayout with style="#android:style/ButtonBar" to give the silver sheen. That style, in turn, uses #android:drawable/bottom_bar as its background. That image can be found in your SDK installation -- go to the platform directory of your choice, then data/res/drawable-hdpi and data/res/drawable-mdpi for the two versions.
The contacts layout looks like a ListView sitting on top of some sort of RelativeLayout or LinearLayout housing the buttons. The silver background may simply have been set using android:background on the Layout itself (layouts are views).
I found that the commonsware books are excellent resources for getting started and have good examples for this type of layout.
Hey, this is a little late, and I know you've already got the silver bar you wanted, which is all good, but I've stumbled upon a really good guide on controlling the soft keyboard for best user experience. It covers, among other things, how to make the visible area resize to fit the button bar in the view while typing, which is done by specifying the activity in the manifest file like so:
<activity android:name=".MyActivity" android:windowSoftInputMode="resize" />
I really recommend reading it, it covers a lot more helpful stuff than just that. Hope that helps; I couldn't see that anyone else has answered that particular part of your question.
You can put them in LinearLayout and assign weight of 1 to each of the buttons.
Also if you own dev phone / or want to see UI of the application in emulator - there is a very cool tool call hierarchyviewer
http://developer.android.com/guide/developing/tools/hierarchy-viewer.html
and you can see how UI of app you like has been laydown.

Categories

Resources