I have an image button inside a frame layout inside of a relative layout. I add the following to the image button android:rotation="-90" but the image button doesnt appear to change.
View Hierarchy
XML
<ImageButton
android:id="#+id/profile_pic_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:background="#drawable/round_profile_pic_btn"
android:contentDescription="profile picture button"
android:padding="20dp"
android:rotation="-90"
android:layout_gravity="center"
android:src="#drawable/ic_face_black_48dp"/>
<com.github.lzyzsd.circleprogress.DonutProgress
android:id="#+id/donut_progress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
custom:donut_progress="70"
custom:donut_text_size="0dp"
android:layout_alignTop="#+id/profile_pic_btn"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_above="#+id/textView5"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:layout_gravity="center" />
Could not post as comment as my rep is not there yet. Did you try it in any emulator or actual device? I copied your xml (except the circleprogress.DonutProgress stuff) and it worked in the emulator and device.
The effect is not visible in Design mode though.
Related
The question is quite simple. How do I get this imageview below to be visible in front of the button below?
I am looking for an XML answer, not a Java answer. Seeing java (I think) will not change anything in the preview screen while working on the xml file.
<ImageView
android:layout_width="35dp"
android:layout_height="35dp"
android:background="#drawable/iconfb"
android:layout_marginTop="90dp"
android:layout_marginLeft="12.5pt"
android:id="#+id/iconfb"
/>
<Button
android:layout_width="300dp"
android:layout_height="40dp"
android:text="Sign in with facebook"
android:onClick="invokefb"
android:textColor="#color/white"
android:textStyle="bold"
android:background="#color/tmfacebook"
android:layout_marginTop="-20dp"
android:layout_marginLeft="12.5pt"
android:id="#+id/fblogin"
"/>
<Button
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawablePadding="10dp"
android:drawableLeft="#drawable/fb"
android:text="Facebook"/>
I want to achieve something of the format as shown in the image. The blue part is background, the image of the guy and girl is a ImageButton. The original images for these are 88x128 (trainer000, trainer001). I want to rescale the ImageButton such that the image covers the entire height and the width is adjusted accordingly. Now I found 2-3 ways to do so but they make use of a separate class to calculate width. I want to know if there is a way to do it purely in the xml file itself.
What I used:
`
<ImageButton
android:id="#+id/maleimage"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:adjustViewBounds="true"
android:scaleType="fitStart"
android:layout_alignParentLeft="true"
android:src="#drawable/trainer000" />
<ImageButton
android:id="#+id/femaleimage"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:adjustViewBounds="true"
android:scaleType="fitStart"
android:layout_alignParentLeft="true"
android:src="#drawable/trainer001" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:textColor="#000000"
android:text="Are you a boy or a girl?"
android:textAppearance="?android:attr/textAppearanceMedium" />
`
What I want is this:
http://imgur.com/9D6XZUT
EDIT: Found the solution. I just used Studio's Layout editor.
i am writing an application to control a robot
for controlling i need ( up, down , right, left ) keys
i used eclipse designer to create it but maybe it is not possible
i want to create something like this :
how can i create buttons like this in center of screen ?
is there a better way to create arrow keys on android ?
Here you go :
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<View
android:id="#+id/view1"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true" />
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/view1"
android:layout_centerHorizontal="true"
android:src="#drawable/ic_launcher" />
<ImageView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/view1"
android:layout_centerHorizontal="true"
android:src="#drawable/ic_launcher" />
<ImageView
android:id="#+id/imageView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toRightOf="#+id/view1"
android:src="#drawable/ic_launcher" />
<ImageView
android:id="#+id/imageView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toLeftOf="#+id/view1"
android:src="#drawable/ic_launcher" />
</RelativeLayout>
Of course, you can replace ImageView with anything else like an ImageButton.
Be sure, if you change the name of the first view, tu update the name in the 4 ImageView.
And be aware that the corners of each image are overlapping each other.
I suggest using ImageButtons and setting the background for each to a State List Drawable xml file. This will change the image between states(focused, pressed, etc).
The tricky part would be positioning each so that they orient themselves in this sort of "box" you have above.
Just create some PNGs of each button in their positions. Up button points up, left points left etc. Then use RelativeLayout to position them with respect to each other. You can also use Buttons as well
I designed one layout which have total 4 RelativeLayout one is outer cover and 3 are child of it. When I put White color in the outer layout than no spaces are left but when I put 9patch image as drawable image than little default padding/margin are left. Is there any properly which solve the padding/margin issue? I have tried margin negative but it will hide bit layout I think it is not proper solution, here is my layout
when I put white color as background than my layout look like
Here is the following code of my layout
<RelativeLayout
android:id="#+id/DetailSection1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/HeaderLayout"
android:layout_toLeftOf="#+id/DetailSection2"
>
<TextView
android:id="#+id/lblRestaurantName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/DetailSection1"
android:layout_marginLeft="5dp"
android:layout_marginTop="5dp"
android:textColor="#color/heding_font"
android:textSize="#dimen/headingFont"
android:text="Restaurant Name" />
<ImageView
android:id="#+id/imgpin"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/lblRestaurantName"
android:layout_margin="5dp"
android:src="#drawable/pin" />
<TextView
android:id="#+id/lblAddress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/lblRestaurantName"
android:layout_marginTop="5dp"
android:layout_toRightOf="#+id/imgpin"
android:text="Address"
android:textColor="#color/restaurant_list_font"
android:textSize="#dimen/lableNormalFont"
/>
<ImageView
android:id="#+id/imgphone"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/lblAddress"
android:layout_margin="5dp"
android:src="#drawable/phn" />
<TextView
android:id="#+id/lblMobile"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/lblAddress"
android:layout_marginTop="5dp"
android:layout_toRightOf="#+id/imgphone"
android:text="Mobile"
android:textColor="#color/restaurant_list_font"
android:textSize="#dimen/lableNormalFont"
/>
<ImageView
android:id="#+id/imgstar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/lblMobile"
android:layout_margin="5dp"
android:src="#drawable/star" />
<TextView
android:id="#+id/lblStar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/lblMobile"
android:layout_marginTop="5dp"
android:layout_toRightOf="#+id/imgstar"
android:text="Star"
android:textColor="#color/restaurant_list_font"
android:textSize="#dimen/lableNormalFont"
/>
</RelativeLayout>
<RelativeLayout
android:id="#+id/DetailSection2"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_alignBottom="#+id/DetailSection1"
android:layout_toLeftOf="#+id/DetailSection3"
android:layout_toRightOf="#+id/lblStar" >
<ImageView
android:id="#+id/imgmore"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:src="#drawable/read_more" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/DetailSection3"
android:layout_width="95dp"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#+id/HeaderLayout"
android:layout_gravity="center"
android:layout_centerInParent="true"
android:background="#drawable/photo_cover" >
<ImageView
android:id="#+id/imgRestaurant"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#+id/lblMobile"
android:layout_margin="5dp"
android:src="#drawable/rihanna" />
</RelativeLayout>
</RelativeLayout>
From the 9-patch drawable image you posted:
The bottom line which indicates the horizontal data population on the view wasn't drawn from the starting point of left.
I am not sure about it. And I know I wasn't clear in explaining the above line.
Just check this:
Consider the below 9-patch is used as a background for a TextView. If you put some text in it, it will start from the area where the bottom line is drawn. Which mean it will start from the left and go all the way to right.
If you use the following 9-patch as a background and try the same thing which you did above. Will result in Text not written from the left. It leaves a bit padding.
That is the reason why you get such result. Of course I am 100% sure about it.
So, just to find out if this works. Try changing the bottom line to fill complete image.
I think you better apply the background color for which layout you want exactly.And one more keep the code so that we can understand easily what is your issue.
Hai all I am new in android programming.....
For my application I am using image button and it successfully installed on the device.
But when I rotate the screen all the button position get changed...
and I need all the button placed at centre of the screen....
And here is my code....
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:id="#+id/testText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#FFCC99"
android:textSize="24dp" />
<ImageButton
android:id="#+id/up"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_marginRight="124dp"
android:layout_marginTop="80dp"
android:src="#drawable/up" />
<ImageButton
android:id="#+id/left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_below="#+id/up"
android:layout_marginRight="200dp"
android:layout_marginTop="150dp"
android:src="#drawable/left" />
please help.......
<ImageButton
android:id="#+id/right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_below="#+id/up"
android:layout_marginRight="50dp"
android:layout_marginTop="150dp"
android:src="#drawable/right" />
<ImageButton
android:id="#+id/down"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/up"
android:layout_alignParentRight="true"
android:layout_marginRight="124dp"
android:layout_marginTop="80dp"
android:src="#drawable/down" />
</RelativeLayout>
well if u are creating your app for both potrait as well as landscape mode then you have to make two different layouts otherwise you can restrict your app to display your app only on the potrait mode by adding a screenOrientation property in your manifest file
android:name=".ListViewImagesActivity"
android:label="#string/app_name"
android:screenOrientation="portrait"
change your layout to relative layout -- and you can also put a different layout for landscape and portrait refer supporting multiple screens by android developers you will understand in a better way http://developer.android.com/guide/practices/screens_support.html
Create layout xml file for both landscape and portrait mode is the good practice. You can also manipulate it through Layout changes, but its recommended to use two layout files.
Then put the landscape layout file in layout-land folder and other in layout-port folder.
For more info : Click here for more info from android developer site