overlap cardview over image - java

I am new to android programming and I am trying to slide my view over image.This is my code(Not sure if this is the right way)
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ron"
android:scaleType="fitCenter"/>
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:id="#+id/cv">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="16dp"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/person_photo"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginRight="16dp"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/person_name"
android:layout_toRightOf="#+id/person_photo"
android:layout_alignParentTop="true"
android:textSize="30sp"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/person_age"
android:layout_toRightOf="#+id/person_photo"
android:layout_below="#+id/person_name"
/>
</RelativeLayout>
</android.support.v7.widget.CardView>
I want to scroll my cardview over image keeping image fixed.something like eclipsing the image.
and after scrolling completely the image should get hidden.(I dont want it to flow under toolbar)

Try to place your CardView into ScrollView and add CardView's marginTop which equals to your Image's height.

Related

How to use scrollview over codeview?

i'm building an tutorial app where im displaying code snippet to user, but scrolling is just working on white area of the screen but not over the code snippet, may be codeview is overlapping the scrollview, How to resolve it so the codeview also scroll:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
<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="wrap_content"
android:layout_height="wrap_content"
android:text="activity_main.xml"
android:textColor="#android:color/black"
android:textStyle="bold"
android:layout_marginTop="5dp"
android:textSize="18sp"/>
<io.github.kbiakov.codeview.CodeView
android:id="#+id/code_view_xml"
android:layout_marginTop="7dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="create layout resource file inside layout directory with name:"
android:layout_marginTop="10dp"
android:textColor="#000000"
android:textStyle="italic"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="single_item.xml"
android:textColor="#android:color/black"
android:textStyle="bold"
android:layout_marginTop="5dp"
android:textSize="18sp"/>
<io.github.kbiakov.codeview.CodeView
android:id="#+id/code_view_item"
android:layout_marginTop="7dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
</ScrollView>
here the output :
You are missing padding. Try adding padding.
Also your linearlayout height is match_parent. Change that to wrap and then try

ImageView covering other contents in android

The image is covering the textView and buttons(I cant even see them at all so I'm guessing they are behind the image). Image is attached. I want the textview and buttons to appear below the imageview. Below is my xml file.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<ImageView
android:id="#+id/imageView9"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:scaleType="fitStart"
android:src="#drawable/bw" />
<EditText
android:id="#+id/name"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/imageView1"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New Button"
android:id="#+id/button" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New Button"
android:id="#+id/button2" />
</LinearLayout>
You can change the main layout to RelativeLayout, set the ImageView at the top and wrap the views below the ImageView, inside a separate layout.
By setting android:layout_above="#+id/linear" for the ImageView, you will be sure that the ImageView will never cover the other views.
<?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:orientation="vertical">
<ImageView
android:id="#+id/imageView9"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/linear"
android:layout_alignParentTop="true"
android:scaleType="fitStart"
android:src="#drawable/bw" />
<LinearLayout
android:id="#+id/linear"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="vertical"
android:gravity="center_horizontal">
<EditText
android:id="#+id/name"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<Button
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New Button" />
<Button
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New Button" />
</LinearLayout>
</RelativeLayout>
Try changing the parent layout to a RelativeView, or a ConstraintView. If you don't want to redo your positioning of your layout, you can wrap everything except the Image in a LinearLayout.
<RelativeView>
<ImageView>
<LinearLayout>
//...All your stuff
</LinearLayout>
<RelativeView>
This isn't one way of course, try to experiment. Feel free to ask if you still encounter problems.

Merging Multiple TextViews onto a Bitmap - should i use canvas?

I have found that you can add or merge textviews onto a bitmap. I have 4 textviews that I would like to merge onto the top of the image.
Here is a screenshot of what I would like to achieve (although at the minute this is textviews at the top separate to the image):
the image is below the textviews. Image header in top right is for what image No it is
So what I am trying to do is once I click the send button it "prints" or merges these Textviews onto the image bitmap below so that I can then save or send the image(with the textviews in it) as one file to my server/device.
So far I have used Canvas.draw() method although it seems to overwrite each other and I am trying to keep the same layout as the screenshot.
Can anyone help?
Try this...
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/bottomLayID"
/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:orientation="vertical"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="2"
android:padding="8dp"
>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Detail work order"
android:textStyle="bold"
android:gravity="center"
android:layout_weight="0.5"
/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Image"
android:textStyle="bold"
android:gravity="center"
android:layout_weight="1.5"
/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="2"
android:padding="8dp"
>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textStyle="bold"
android:gravity="center"
android:layout_weight="0.5"
/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textStyle="bold"
android:gravity="center"
android:layout_weight="1.5"
/>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/bottomLayID"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_alignParentBottom="true"
>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Open Camera"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Send Image"
android:background="#99d72e"/>
</LinearLayout>
</RelativeLayout>
Give background as transparent color and border to textviews.
You can set bitmap to imageview by
ImageView mImg;
mImg = (ImageView) findViewById(R.id.(your xml img id));
mImg.setImageBitmap(img);

Android Custom ViewGroup not rendering correctly

I have a ViewGroup that has the following xml layout:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:id="#+id/ticketBuy_viewLayout"
android:paddingLeft="16dp"
android:paddingRight="16dp">
<ImageView
android:id="#+id/ticketBuy_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_alignParentBottom="true"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true" />
<TextView
android:id="#+id/ticketBuy_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:layout_toRightOf="#id/ticketBuy_icon"/>
<TextView
android:id="#+id/ticketBuy_date"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/ticketBuy_icon"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"/>
</RelativeLayout>
Later, I put these Views into a ListView. And, well, don't really get the desired result.
What I want it to be is a small rectangular view with an image to the left, a title to the top right and the date to the bottom left. I am not posting the ListView xml because it does not have anything that would be of use (just a width and height set to match_parent) However, all I get is this (This ListView has about 8 elements):
I think you just messed up with the layout.
Try this layout :
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/ticketBuy_viewLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="16dp"
android:paddingRight="16dp" >
<ImageView
android:id="#+id/ticketBuy_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginLeft="5dp"
/>
<TextView
android:id="#+id/ticketBuy_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/ticketBuy_icon"
/>
<TextView
android:id="#+id/ticketBuy_date"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_toRightOf="#id/ticketBuy_name"
/>
</RelativeLayout>

Scroll middle content with ListView in Android Layout

I'm developing android app as per the following design.
I want to set the height of the scroll view to the remaining screen size (after occupied by header,footer and other texts) although there are no any contents in the list view. When the items added to the list view (dynamically) I want to scroll it withing the same. But now I'm unable to set initial height when there are no items in the list view.
bellow is my layout file.
<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"
android:background="#color/background_color"
tools:context=".HomeActivity"
android:weightSum="1.0" >
<RelativeLayout
android:id="#+id/relativeLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:background="#color/header_color"
android:paddingBottom="#dimen/header_vertical_margin"
android:paddingLeft="#dimen/header_horizontal_margin"
android:paddingRight="#dimen/header_horizontal_margin"
android:paddingTop="#dimen/header_vertical_margin" >
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:orientation="horizontal"
android:weightSum="1.0" >
<ImageButton
android:id="#+id/ImageButton03"
android:layout_width="62dp"
android:layout_height="match_parent"
android:layout_gravity="left"
android:layout_weight="0.2"
android:adjustViewBounds="true"
android:background="#android:color/transparent"
android:gravity="left"
android:scaleType="centerInside"
android:src="#drawable/title_left_img" />
<ImageView
android:id="#+id/headerImg"
android:layout_width="139dp"
android:layout_height="match_parent"
android:layout_weight="0.7"
android:scaleType="centerInside"
android:src="#drawable/header_img"
android:layout_margin="5dp" />
<ImageButton
android:id="#+id/ImageButton04"
android:layout_width="38dp"
android:layout_height="wrap_content"
android:layout_weight="0.1"
android:adjustViewBounds="true"
android:background="#android:color/transparent"
android:scaleType="centerInside"
android:src="#drawable/title_right_img" />
</LinearLayout>
</RelativeLayout>
<RelativeLayout
android:id="#+id/relativeLayout2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/relativeLayout1"
android:paddingBottom="#dimen/body_vertical_margin"
android:paddingLeft="#dimen/body_horizontal_margin"
android:paddingRight="#dimen/body_horizontal_margin"
android:paddingTop="#dimen/body_vertical_margin" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:orientation="vertical" >
<TextView
android:id="#+id/dayText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="TextView"
android:textColor="#color/day_color"
android:textSize="#dimen/day_size"
android:textStyle="bold" />
<TextView
android:id="#+id/dateTimeText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="TextView | TextView"
android:textColor="#color/time_date_color"
android:textSize="#dimen/date_time_size"
android:textStyle="normal" />
<ScrollView
android:id="#+id/scrollView1"
android:layout_width="wrap_content"
android:layout_height="0px"
android:background="#drawable/rounced_rect"
android:layout_weight="1"
android:fillViewport="true" >
<ListView
android:id="#+id/list_tracking"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:dividerHeight="1dp"
android:scrollingCache="true" >
</ListView>
</ScrollView>
</LinearLayout>
</RelativeLayout>
<RelativeLayout
android:id="#+id/relativeLayout3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_marginBottom="1dp"
android:paddingBottom="#dimen/footer_vertical_margin"
android:paddingLeft="#dimen/footer_horizontal_margin"
android:paddingRight="#dimen/footer_horizontal_margin"
android:paddingTop="#dimen/footer_vertical_margin" >
<ImageButton
android:id="#+id/imageButton1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:src="#drawable/track_button"
android:adjustViewBounds="true"
android:background="#android:color/transparent"
android:scaleType="centerInside" />
</RelativeLayout>
I'm new to android app and any guidance is really appreciated.
You can't use a ListView inside a ScrollView.
You could either use a ScrollView or ListView, but not both together or one inside the other.
To summarize my comment:
Remove the unnecessary relativeLayout1, 2, and 3 and scrollView. Then move the bottom image button above the linear layout, so you can make the linear layout position itself with layout_above the image button and give it a height of match_parent. This makes it fill the space between the top linear layout and the bottom image button. And finally make the scroll view's height match_parent so it will also fill the space remaining below the text views.

Categories