Displaying popup images on button click - android

Please refer the image given in the url
http://docs.google.com/Doc?docid=0AQhgDtGvE2HgZGZ6cmtua185M2RneG5nYmNm&hl=en
My query is, How can I display the messages corresponding to the rounded buttons and the table row , when I click on the rounded button with question mark.
I know, I have to use listener for the ? button , but what should I do in listener exactly, such that when I click, it shows those alerts(images) and when I click again, it disappears.
For this UI, I have used Relative layout as was suggested here -- Aligning components at desired positions -- and it worked perfect for me.
So, do I need to change my base layout altogether for accomplishing this?

You can use a FrameLayout as the base for your ui layout and then add an ImageView overlay. For example:
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/MainFrame"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<!-- Put your normal layout stuff here -->
</FrameLayout>
Then in your code you can create the ImageView and add it to the MainFrame and it will overlay your UI, like this:
FrameLayout mainFrame = (FrameLayout)findViewById(R.id.MainFrame);
ImageView overlay = new ImageView(this);
overlay.setImageBitmap(BitmapFactory.decodeResource(getResources(), R.drawable.overlay));
mainFrame.addView(overlay);
Then later you can call:
mainFrame.removeView(overlay);
to have it go away.

Related

Android placing imageView through Code

I want on the initialization of my activity in android to set the position of some imageView's
by code.
Lets say I have five cards displayed on the screen, all placed in (0,0) by me in the XML.
I want to calculate the screen size (easy to do) and then place the first card at 0.2height , 0.2 width the second one 0.4height, 0.4 width, ETC.
I want to do it through code so i could change some constants in the future and the rest of the changes will apply automatically
Thanks.
Create a LinearLayout container view in your layout, and then use code to add your new View to it
<LinearLayout
android:id="#+id/container"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>
And then:
((ViewGroup)findViewById(R.id.container)).addView(myImageView);
try to use "findViewById()" to inflate some parental layouts,
"new ImageView()" to construct new Views and ".add(myImageView)" to add them.
In your code u can use all kinds of setters for the imageview...
(btw: more details would be great, the question is kinda ambiguous)

How do I layout a button bar with buttons of different heights?

How do I go about implementing a button bar with buttons of different shapes and heights? As an example (please excuse my poor drawing skills for this quick mockup):
The example bar has 3 buttons, with the middle button (3) a different shape and height than the other 2 buttons (1,2). The button bar will be a view that is included and merged into other views so as to seem to float on top of the parent view.
I was thinking of implementing buttons 1 and 2 into a layout, and then button 3 as another layout that I then merge with the first two button's layout.
like my previous comrades said, you need some kind of layout or container that can have a background (if you wish for button #3 to hoover above it) then use relative layout for mixing the two the disadvantage of this other than complexity is that youcannot relate to the other two buttons since they reside in a different layout.
More elegant solution may be to have a special background drawable that can:
have a method setCurrentHeight() that will specify the height the actual viewable section should have the rest will be filled with transparent color.
override it's own draw so just before it's drawing it will have a callback called, call back you can register yourself to.
then you can register the callback in your activity to take the current position of the #3 button and set the height accordingly, this way you are still with one layout with special drawable as background.
A customized LevelDrawable might do the trick.
I would layout this bar as follows:
A RelativeLayout as a container for the rest, with height set to wrap_content and alignparentbottom = true
An ImageView for the bar
2 Buttons with a transparent background (Button 1 and 2)
Button 3 is a custom Button with a custom Image of a trapezoid as background
So you will have a Layout similar to this:
<RelativeLayout
...>
<ImageView
.../>
<Button
... Button 1 />
<Button
... Button 2 />
<Button
... Button 3 />
</RelativeLayout>
I don't exactly know that this will work, and I can't test it, but you might give something like this a try; I believe it can all be done elegantly through XML.
Have a RelativeLayout (id:mainLayout) that will contain all of your views, wrap_content for both dimensions.
Have a blank View as your first child that will serve as your background bar
Set the View's background color/image to what you want; layout_width to fill_parent; layout_height to wrap_content; layout_alignTop="#id/leftButton"; layout_alignBottom="#id/leftButton".
Add an ImageButton for your center button (id:bigButton), wrap_content for both dimensions; layout_centerInParent="true".
Add an ImageButton for your left button (id:leftButton), wrap_content for both dimensions; layout_toLeftOf="#id/bigButton"; layout_centerInParent="true".
Add an ImageButton for your right button (id:rightButton), wrap_content for both dimensions; layout_toRightOf="#id/bigButton"; layout_centerInParent="true".
In my head, I believe this works, but I could be off. Regardless, something to think about, and I hope it helps you find a solution. :)
Better you can tablelayout with different button styles or relative layout for button "3"

How to create an ImageButton with an overlayed image?

I have a button that starts out as a placeholder, but once the user authenticates, it changes to a custom image for that user.
<ImageButton android:id="#+id/button"
android:background="#null"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:src="#drawable/button_default"/>
And then later:
ImageButton ib = (ImageButton)findViewById(R.id.button);
ib.setImageBitmap(previouslyDecodedBitmap);
But this looks terrible. I can't figure out how to style it properly so that the newly decoded bitmap is the right size and behaves like an ImageButton. I suspect there is some combination of widgets I can use other than ImageButton to achieve this? I was hoping I could just nest an ImageView on top of the ImageButton by adding it as a child to ImageButton, but that doesn't seem to be allowed (it is in Silverlight...).
Anyway, any suggestions on how to properly do this are welcome. Thanks.
One way would be to use frame layout and place buttons and image one over the other , top being imageview , keep it invisible (android:visibility = "invisible")
On clicking the button and authenticating , make it visible over the button or else even you can hide the button below and show only image on top.

Android: Adding button to custom title bar

I have created a custom title bar as shown in this example
http://staticallytyped.wordpress.com/2011/03/18/android-dynamic-and-custom-title-bars/
"A custom title bar" - half way down.
On some activities I would like to place a button on the right hand side of the titlebar (same as facebook app). I have attempted to add a button to the view as follows, but it doesn't appear.
Custom title bar is displayed as follows
requestWindowFeature(Window.FEATURE_CUSTOM_TITLE);
setContentView(R.layout.maintabhost);
getWindow().setFeatureInt(Window.FEATURE_CUSTOM_TITLE, R.layout.headerbar_include);
Attempting to add button as follows. The button will eventually be an ImageButton and aligned to right of custom titlebar-if I get it working. (just realised I've too many layoutparams now, but this isnt affecting the button display)
LinearLayout layout = (LinearLayout) findViewById(R.id.headerbar);
Button searchButton = new Button(this);
searchButton.setText("info");
LayoutParams layoutParams = new LinearLayout.LayoutParams
(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
searchButton.setLayoutParams(new LayoutParams(
ViewGroup.LayoutParams.WRAP_CONTENT,
ViewGroup.LayoutParams.WRAP_CONTENT));
layout.addView(searchButton, layoutParams);
layout.invalidate();
I could just create another custom titlebar with the button already embedded, but a dynamic solution would be better.
Cheers
First of all, thanks for the link to my blog. Second, let me see if I can't answer that for you. One of the reasons you're having trouble adding another button when you want to add a button is that in that example I left you with no way of retrieving the Title Bar View through the usual channels. Hence, let's fix it (and potentially let me write another blog post this coming weekend.)
Starting with the xml file, add an id attribute:
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_horizontal"
android:orientation="horizontal"
android:id="#+id/title_complex">
<!-- Stuff -->
</LinearLayout>
and here's code to show you how to get that button in there within your Activity (you'll have to add all the flair later):
LinearLayout layout = (LinearLayout) getWindow().findViewById(R.id.title_complex);
layout.addView(new Button(this));
and if you take a look, there's a non-descript button in the Title Bar (like I said, you'll have to add your own flair):
Due note, however, that I can't guarantee that the button will remain or won't remain on subsequent Activities. I haven't investigated it yet but this should get you started. And if you have any more questions, feel free to ask them here (more eyeballs) or on my blog.
Here's one approach to make sure the button(s) remain in the title bar:
How to Create Custom Window Title in Android
Essentially, wrap the android Activity class, and then extend from that new class.

Android: How to Create a Custom button widget

I would like to create a button with circular or rectangular background, text and an image below or above the text.
Here is the CustomButton Layout where I added the objects (background and text - ImageView is missing):
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="wrap_content"
android:orientation="horizontal" android:layout_width="wrap_content" android:layout_gravity="center_vertical|center_horizontal">
I would like to create a CustomButton object with methods setText() and setImage() which would change the button text and image and place multiple CustomButtons into main layout.
Does anyone know how to create a custom layout, place it into another layout(main) and modify its elements from the activity which is bound to main layout?
I would really appreciate your help.
Thanks!
Hey, To create a circular button or rectangular button you can use shape.
It can be done in .xml file.
see this Click Here
If you want programmatic access, you should subclass View and do your work there in java. You can still do the layout in xml, but have the image and text methods that you want. You will then be able to use this in another layout to place your CustomButtons.

Categories

Resources