i'm at learning stage of android. i want to set TextView on ImageView. i'm not getting point. I'll be thankful. Here's is my XML code.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="380dp"
android:adjustViewBounds="true"
android:scaleType="fitCenter"
android:background="#drawable/wf" />
<TextView
// what should i add here so that it can be visible on image view//
/>
</LinearLayout>
Thanks to all, Finally i got solution. i used FrameLayout to handle it.
Here is the code
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="380dp"
android:adjustViewBounds="true"
android:scaleType="fitCenter"
android:background="#drawable/wf" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="8"
android:textSize="100sp"
android:layout_marginTop="120dp"
android:layout_marginLeft="160dp"
android:textAppearance="?android:attr/textAppearanceLarge" />
</FrameLayout>
I think what you want is something like a photo caption therefore the Best way you can achieve that is by using a relative layout and your .xml layout would look like:
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="69dp"/>
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/imageView1"
android:layout_centerHorizontal="true"
android:text="TextView" />
Take note of the property of the textView
android:layout_below="#+id/imageView1"
That is the key.
If for any reason you prefer a linearlayout as the main layout , you can nest a relative layout in a table -row (or another linear layout) which is nested in the main linear layout
i hope that isnt complicating
PS:this is a beginner's advice
You can also use RelativeLayout as a parent, ImageView as the first child element and TextView as the second child element.
You can use a RelativeLayout like this :
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="380dp"
android:adjustViewBounds="true"
android:scaleType="fitCenter"
android:background="#drawable/wf" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</RelativeLayout>
Related
Sorry in advance I need to include a few pictures to make my problem a little easier to understand. I am using a linear layout for my custom rows and it is giving me lots of trouble trying to get the rows to look how I want. Currently it looks like this
Please forgive the quick paint picture I am about to show but it is how I would like the layout to look.
I would like to add the name textbox above the dog picture, and a time stamp textbox above each of the 1 and 2. Whenever I try to add textboxes to display this it really messes with the layout. The textbox above the dog picture always wants to go to the right or left of the dog image and push the image to the middle of the page and the buttons get spread out further. I do not have much experience with this layout I typically do relative layout where I can drag and drop pieces. Any advise or help is greatly appreciated.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageButton
android:layout_width="150dip"
android:layout_height="150dip"
android:id="#+id/dogimage"
android:clickable="true"
android:layout_alignParentLeft="true"
android:background="#drawable/dogpic"
android:onClick="sendProfile"
android:scaleType="fitXY" />
<ImageButton
android:layout_width="75dip"
android:layout_height="75dip"
android:id="#+id/dog1num1"
android:background="#drawable/num1"
android:clickable="true"
android:onClick="NumberOne"
android:layout_marginLeft="10dp"
android:layout_marginTop="75dp"
android:scaleType="fitXY" />
<ImageButton
android:layout_width="75dip"
android:layout_height="75dip"
android:id="#+id/dog1num2"
android:background="#drawable/num2"
android:clickable="true"
android:onClick="NumberTwo"
android:layout_marginLeft="10dp"
android:layout_marginTop="75dp"
android:scaleType="fitXY" />
</LinearLayout>
You need to wrap your imageview/textview combo in a LinearLayout. And you should set the imageButton using src, not background. Do it like this:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Title" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageButton
android:id="#+id/dogimage"
android:layout_width="150dip"
android:layout_height="150dip"
android:clickable="true"
android:onClick="sendProfile"
android:scaleType="fitXY"
android:src="#drawable/dogpic" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Timestamp 1" />
<ImageButton
android:id="#+id/dog1num1"
android:layout_width="75dip"
android:layout_height="75dip"
android:layout_marginLeft="10dp"
android:clickable="true"
android:onClick="NumberOne"
android:scaleType="fitXY"
android:src="#drawable/num1" />
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Timestamp 1" />
<ImageButton
android:id="#+id/dog1num2"
android:layout_width="75dip"
android:layout_height="75dip"
android:layout_marginLeft="10dp"
android:clickable="true"
android:onClick="NumberOne"
android:scaleType="fitXY"
android:src="#drawable/num2" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
I have stuck in some xml code and i hope you can help me out.
So here is what I need/what I have done by now.
I have 3 images of 650px width and I need them one below another while keeping aspect ratio.
I did that with the following code and it looks as it should. No problem here.
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/ll"
android:orientation="vertical"
android:background="#3afa3f"
android:weightSum="3">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/krk_history"
android:layout_weight="1"
android:background="#drawable/povjestkrka_vintage_yellow600" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:id="#+id/krk_frankopan"
android:background="#drawable/frankopan2_vintage_sundown600" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:id="#+id/krk_turizam"
android:background="#drawable/krk_turizam_vintage"/>
The problem is. I need to put three textviews in a left bottom corner of each image. Imagine it like image menu with text description on each image.
So, I can not use relative or frame layout because images won't play nicely with each other :) There is always a gap between or not aspect ration etc. I need weightsum.
Second, I can't hardcode the text on each image in photoshop because the app will be translated and text needs to change for each language.
I can have different images for each language but I am trying to avoid that.
Ah yea, one more last thing.
I tried to put entire linearlayout in relative layout and put the text between but the text appears beneath the image and I can't bring it upfront.
Any suggestions?
Thanks a lot,
Xsonz
just copy this :
<?xml version="1.0" encoding="UTF-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<FrameLayout android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<ImageView
android:id="#+id/imageView1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/ic_launcher" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left|bottom"
android:padding="5dp"
android:text="Text 1" />
</FrameLayout>
<FrameLayout android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<ImageView
android:id="#+id/imageView2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/ic_launcher" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left|bottom"
android:padding="5dp"
android:text="Text 2" />
</FrameLayout>
<FrameLayout android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<ImageView
android:id="#+id/imageView3"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/ic_launcher" />
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left|bottom"
android:padding="5dp"
android:text="Text 3" />
</FrameLayout>
Take three FrameLayout inside your LinearLayout and inside FrameLayout keep the ImageView and TextView.
Or Else You can use RelativeLayout and give dependency to Views
You can use frame layout inside linear layout. create imageview inside the linear layout and create textview in another frame layout below it.
<FrameLayout
android:id="#+id/frameLayout_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/krk_history"
android:layout_weight="1"
android:background="#drawable/povjestkrka_vintage_yellow600" />
</FrameLayout>
<FrameLayout
android:id="#+id/frameLayout_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="-5dp" >
<TextView
android:id="#+id/text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="string" />
</FrameLayout>
Something like this might work for you.
//your layout -> LinearLayout>
....
<RelativeLayout android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/image1"
android:layout_weight="1"
android:background="#drawable/A1" />
<TextView android:id="#+id/textview1"
android:layout_margin="0dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="My Text"
android:layout_below="#id/image1"
android:layout_alignLeft="#id/image1" />
</RelativeLayout>
// end your LinearLayout
You can play with these parameters using Relative Layout Parameters android.com. The relative layout allows you to control the "relative" positioning between your elements.
You can lay your images out side by side, or in whatever fashion you wish.
Then you can adjust the text dynamically.
I'm trying to show a vertical line in an android ListView item. I define it in the XML for the cell but when I preview it in the ListView it doesn't appear.
I understand this is an issue because I see alot of questions on here, but don't see any real answer.
The XML is pretty standard:
Cell:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/appWhite" >
<View android:layout_width="5dp"
android:layout_height="match_parent"
android:background="#color/appGreen"
android:layout_alignParentLeft="true" />
<RelativeLayout
android:id="#+id/cell_trip_info_container"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/vertical_bar" >
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/cell_trip_name"
android:paddingTop="20dp"
android:paddingBottom="20dp"
android:textColor="#2c3e50"
android:paddingLeft="10dp"
android:text="adfadf" />
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/cell_trip_country"
android:layout_below="#+id/cell_trip_name"
android:textColor="#2c3e50"
android:paddingLeft="10dp"
android:text="adfadf" />
</RelativeLayout>
<RelativeLayout android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:id="#+id/whole_container"
android:layout_alignParentRight="true" >
<RelativeLayout android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#color/appGreen"
android:id="#+id/cell_trip_date_box"
android:layout_alignTop="#+id/update_buttons"
android:layout_alignBottom="#+id/update_buttons"
android:padding="20dp" >
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/cell_tripstart_date"
android:layout_centerHorizontal="true"
android:textColor="#fff" />
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/cell_date_thru"
android:text="#string/thru"
android:layout_below="#+id/cell_tripstart_date"
android:layout_centerHorizontal="true"
android:textColor="#fff" />
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/cell_tripend_date"
android:layout_below="#+id/cell_date_thru"
android:textColor="#fff"
android:layout_centerHorizontal="true" />
</RelativeLayout>
<RelativeLayout android:layout_width="wrap_content"
android:layout_height="match_parent"
android:id="#+id/update_buttons"
android:visibility="gone"
android:layout_toRightOf="#+id/cell_trip_date_box"
android:background="#e9e9e9"
android:padding="20dp" >
<ImageView android:layout_width="wrap_content"
android:layout_height="match_parent"
android:id="#+id/cell_button_edit_trip"
android:src="#drawable/slide_edit"
android:adjustViewBounds="true"
android:contentDescription="#string/content_description" />
<ImageView android:layout_width="wrap_content"
android:layout_height="match_parent"
android:id="#+id/cell_button_delete_trip"
android:src="#drawable/slide_delete"
android:layout_toRightOf="#+id/cell_button_edit_trip"
android:adjustViewBounds="true"
android:contentDescription="#string/content_description" />
</RelativeLayout>
</RelativeLayout>
</RelativeLayout>
I found the cause and the obvious solution/workaround on another post Here
Basically RelativeLayouts for whatever reason won't play nice with the "match_parent" height setting in a ListView Item. One of the answer to the post recommended using a LinearLayout instead. So I just created a new File with the parent view being a LinearLayout. I then created a RelativeLayout child and tossed everything else in there.
It worked fine this time, easily allowing me to create my vertical rule.
In your cell_trip_info_container RelativeLayout you have
android:layout_toRightOf="#+id/vertical_bar"
You dont have a View named vertical_bar
Add that ID to your vertical bar view and you should be good to go
<View
android:id="#+id/vertical_bar"
android:layout_width="5dp"
android:layout_height="match_parent"
android:background="#color/appGreen"
android:layout_alignParentLeft="true" />
change
RelativeLayout
to
VerticalLayout
I'm developing an Android app in eclipse.
I have an XML which has 2 linear layouts next to each other. The left one has several buttons, which make content visible in the right. However, I would not only like these buttons to make specific content visible, but hide (setVisibility.GONE) all the other stuff in that layout. I have already tried removeAllViews, but this is not suitable for me since it deletes them. So my idea is to hide (set the visibility to gone) every single stuff, then make the ones I wish visible. The reason I ask this is that it takes too much time setting the visibility to gone for everything (24, actually) for all the 12 buttons.
Thanks in advance
Layout code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/alap"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ScrollView
android:id="#+id/scrollView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/imageView3"
android:layout_alignParentLeft="true"
android:layout_below="#+id/imageView4" >
<LinearLayout
android:layout_width="197dp"
android:layout_height="match_parent"
android:orientation="vertical" >
<ImageView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/lewis" />
<Button
android:id="#+id/first"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/first" />
<Button
android:id="#+id/second"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/second" />
</LinearLayout>
</ScrollView>
<ImageView
android:id="#+id/imageView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:scaleType="center"
android:src="#drawable/cpr1" />
<ImageView
android:id="#+id/imageView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:scaleType="center"
android:src="#drawable/epizodok" />
<LinearLayout
android:id="#+id/def"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/imageView3"
android:layout_alignParentRight="true"
android:layout_alignTop="#+id/scrollView2"
android:layout_toRightOf="#+id/scrollView2"
android:orientation="vertical"
android:visibility="visible" >
<ImageView
android:id="#+id/image1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/lewis"
android:visibility="gone" />
<ImageView
android:id="#+id/image2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher"
android:visibility="gone" />
</LinearLayout>
</RelativeLayout>
Please try this...
<LinearLayout
android:id="+id/ll"
android:layout_width="197dp"
android:layout_height="match_parent"
android:orientation="vertical" >
<!-- All content which you hide/show put here -->
</LinearLayout>
now in your class file you read this.
LinearLayout ll = (LinearLayout) findViewById(R.id.ll);
after that as per your requirement you hide/show this Layout with their all contents.
like:
For Hide.
ll.setVisibility(View.GONE);
For Show.
ll.setVisibility(View.VISIBLE);
when you hide/show LinearLayout all content with this Layout also hide/show automatically.
Simply, Just take another Linear Layout with vertical layout within your "def" Linear layout..Nd change its visibility as per your need.
<LinearLayout
android:id="#+id/def"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/imageView3"
android:layout_alignParentRight="true"
android:layout_alignTop="#+id/scrollView2"
android:layout_toRightOf="#+id/scrollView2"
android:orientation="vertical"
android:visibility="visible" >
<LinearLayout
android:id="#+id/Subdef"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:id="#+id/image1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/lewis"
android:visibility="gone" />
<ImageView
android:id="#+id/image2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher"
android:visibility="gone" />
</LinearLayout>
</LinearLayout>
No need to hide views instead of that just use ViewFlipper concept.
Just declare view flipper in your xml file with your two linearlayouts like this
<Viewflipper android:id="#+id/myViewFlipper" android:layout_height="wrap_content" android:layout_width="match_parent">
<LinearLayout android:id="#+id/layout1" android:layout_height="wrap_content" android:layout_width="match_parent"></LinearLayout>
<LinearLayout android:id="#+id/layout2" android:layout_height="wrap_content" android:layout_width="match_parent"></LinearLayout>
</Viewflipper>
And get viewflipper reference in your java code like this
Viewflipper mFlipper = (Viewflipper)findViewById(R.id.myViewFlipper);
use mFlipper.showNext(), use mFlipper.showPrevious() methods to hide and show your layouts thats it.
In a vertical linear layout, I have 2 textviews, then a button and then a frame layout.
I would like the button to be on the left of the frame layout. I tried putting the button in a relative layout, but how do I tell the frame layout to be on the right?
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/content_container_white"
android:orientation="vertical" >
<TextView
android:id="#+id/editText1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="30dp"
android:text="#string/t0"
android:textColor="#color/black"
android:textSize="30dp" />
<TextView
android:id="#+id/editText2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/t1"
android:textColor="#color/black" />
<RelativeLayout
android:id="#+id/RelativeLayout1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<Button
android:id="#+id/buybtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:layout_marginLeft="30dp"
android:text="#string/buy_button" />
</RelativeLayout>
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|right"
android:layout_marginTop="10dp" >
<ImageButton
android:id="#+id/videothumb"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|center_vertical"
android:src="#drawable/button_play_on" />
<ImageView
android:id="#+id/videothumbimage"
android:layout_width="380dp"
android:layout_height="170dp"
android:scaleType="centerCrop"
android:src="#drawable/demo_thumb_home" />
</FrameLayout>
</LinearLayout>
You can do it by simply telling your FrameLayout android:layout_toRightOf="#+id/#+id/buybtn", but your FrameLayout must be inside a RelativeLayout too.
<RelativeLayout
android:id="#+id/RelativeLayout1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<Button
android:id="#+id/buybtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:layout_marginLeft="30dp"
android:text="#string/buy_button" />
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|right"
android:layout_marginTop="10dp"
android:layout_toRightOf="#+id/#+id/buybtn" >
<ImageButton
android:id="#+id/videothumb"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|center_vertical"
android:src="#drawable/button_play_on" />
<ImageView
android:id="#+id/videothumbimage"
android:layout_width="380dp"
android:layout_height="170dp"
android:scaleType="centerCrop"
android:src="#drawable/demo_thumb_home" />
</FrameLayout>
</RelativeLayout>
Push FrameLayout into RelativeLayout or just put button and frame together in horizontal LinearLayout - what would be more simple
ps - kepp your code clean, use ctrl+shift+F (if using Eclipse) to auto-arrange it
Put your framelayout within Relativelayout and then set property align parent right.
The question makes no sense. From the documentation:
FrameLayout is designed to block out an area on the screen to display a single item.
Emphesis mine.
If you want your layout to contain more than one item, do not use a frame layout. Use something else.
Shachar