Develop Reference

Animating views in a linearlayout

I am using a LinearLayout with an edittext and then an image. On a button click I animate my image out of the screen thus giving space to the edittext. But the edittext resizes its width suddenly without animating.
How can I achieve this that the edittext resizes with animation. Pls help
Thanks in advance!!!!
Edit1: My xml file
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/search_parent"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:orientation="horizontal" >
<ImageView
android:id="#+id/hj_back_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#string/empty_string"
android:scaleType="centerCrop"
android:src="#drawable/ic_action_navigation_arrow_back_grey" />
<EditText
android:id="#+id/hj_search_edittext"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/apptheme_edit_text_holo_light"
android:gravity="left|center_vertical"
android:hint="#string/hj_search_text"
android:includeFontPadding="false"
android:paddingLeft="#dimen/hj_margin_small"
android:textColor="#color/hj_search_text_color"
android:textColorHint="#color/hj_search_bar_border_color"
android:textSize="#dimen/hj_font_small" />
<ImageView
android:id="#+id/my_cart_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end|center_vertical"
android:scaleType="centerCrop"
android:src="#drawable/ic_action_shopping_cart_grey" />
In the above xml my_cart_icon moves to the right. I want my edittext to scale it smoothly to fill the left space.

You can achieve a simple animation effect of hiding/removing one of the views and stretching the others using android:animateLayoutChanges="true". Hope it helps!

How to position image1 on right top of the image2 in android?

How can i achieve a layout with 2 images in android, one image overlaying another image at the top right?
an image overlapping another image at the top right
http://i.imgur.com/uT3L2wl.jpg
I tried using relative layout, but i could position the overlay image by giving layout margin, but if i do that i cant support all screen sizes with that design.
and also i couldnt position the overlay image with respect to the underimage.
i want to design my layout like the pic i have shared.

I could get this working from the below code,
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/main1"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<RelativeLayout
android:id="#+id/c1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true" >
<ImageButton
android:id="#+id/addnewcustomer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#null"
android:src="#drawable/ic_launcher" />
</RelativeLayout>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#id/c1"
android:layout_toRightOf="#id/c1" >
</RelativeLayout>
<ImageButton
android:id="#+id/hover1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/c1"
android:layout_alignLeft="#+id/c1"
android:layout_marginBottom="23dp"
android:layout_marginLeft="22dp"
android:background="#null"
android:src="#drawable/ic_launcher" />
</RelativeLayout>

Try look at FrameLayout. It will do the job.
http://www.learn-android-easily.com/2013/05/frame-layout-in-androis.html

ListView highlighter doesn't work over certain png's

I've a layout for top (and bottom) elements which look like this :
<?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" >
<ImageView
android:id="#+id/topbgprayer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:background="#drawable/prayer_top" />
<ImageView
android:id="#+id/topleftpatchprayer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/topbgprayer"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_alignRight="#+id/leftbgprayer"
android:src="#drawable/prayer_top_left_patch" />
<ImageView
android:id="#+id/toprightpatchprayer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:src="#drawable/prayer_top_right_patch" />
<ImageView
android:id="#+id/ivImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="10dp"
android:src="#drawable/play_fill_free_download" />
<ImageView
android:id="#+id/spare_play"
android:layout_width="1dp"
android:layout_height="wrap_content"
android:src="#drawable/spare_play" />
<TextView
android:id="#+id/tvDescr"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toRightOf="#+id/ivImage"
android:lineSpacingMultiplier="1.05"
android:layout_marginRight="30sp"
android:text="Молитвы Утренние"
android:textSize="18sp" />
<TextView
android:id="#+id/tvBottom"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:gravity="center_horizontal"
android:paddingBottom="6dp"
android:layout_toLeftOf="#+id/tvDescr"
android:text="12 МБ"
android:textSize="10sp"
android:typeface="sans" />
</RelativeLayout>
so, main idea is that on top elements there is a tiled image on top and two patches to smooth the corners.
For some reason, highlighter on a ListView doesn't highlight over that images, but highlight others. If I try to delete some of theese images - it highlights area where they were deleted. How can I fix that?

The highlight by default is drawn behind the list item view, therefore you see in behind the text and behind the triangle image (probably because the triangle image is transparent around the triangle), the other image is opaque so it hides the highlight.
What you should do is make a semi-transparent highlighter and draw it on top of the view. Check out this question for information on how to draw in on top: How to highlight ListView item on touch?
Alternatively you can disable the highlight completely, and add a hidden view on top of all the list item and use onTouchListener() to show it only when there is an ACTION_DOWN and hide it again when there is an ACTION_UP.

Using RelativeLayout, LinearLayout and layout_weight at the same time - weird behaviour

I've got an activity layout specified in an XML file - activity_intro.xml - and I'm trying to create another one that is similar but slightly different - that's going to be activity_instructions.xml.
The Intro activity has a 9patch image at the bottom of the screen that is supposed to stay there and only adjust to different widths of the screens.
The Instructions activity is supposed to contain the same image but above 2 more buttons - all three of these views need to be always located at the bottom of the screen.
activity_intro.xml:
<?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" >
<ScrollView
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#drawable/home_background" >
<LinearLayout
style="#style/Activity"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<ImageView
android:id="#+id/introAnimationImageView"
android:layout_width="152dip"
android:layout_height="176dip"
android:layout_gravity="center_horizontal"
android:contentDescription="#string/intro_animation_content_description"
android:src="#drawable/animation_intro01" />
<TextView
android:id="#+id/introTextViewTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/intro_title"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/introTextViewSubtitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/intro_subtitle"
android:textAppearance="?android:attr/textAppearanceMedium" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<Button
android:id="#+id/introButtonLoginSignup"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:text="#string/intro_button_label_login_signup" />
<Button
android:id="#+id/introButtonInstructions"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_alignRight="#+id/introButtonLoginSignup"
android:text="#string/intro_button_label_instructions" />
<Button
android:id="#+id/introButtonReportAnonymously"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/introButtonLoginSignup"
android:layout_centerHorizontal="true"
android:text="#string/intro_button_label_report_anonymously" />
</RelativeLayout>
</LinearLayout>
</ScrollView>
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0"
android:contentDescription="#null"
android:scaleType="fitXY"
android:src="#drawable/footer_cityscape" />
</LinearLayout>
Result:
Since I've got working code for Intro, I wanted to make Instructions follow its example but the layout_weight property isn't behaving as expected. First of all, I was only trying to put in the 2 buttons and leave out the image:
<?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" >
<ScrollView
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_weight="0.1"
android:background="#drawable/home_background" >
<LinearLayout
style="#style/Activity"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
android:id="#+id/instructionsTextViewTitle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="#string/instructions_title_1"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textStyle="bold" />
<ImageView
android:id="#+id/instructionsImageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#string/instructions_image_content_description"
android:src="#drawable/forms" />
<TextView
android:id="#+id/instructionsTextViewDescription"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/instructions_description_1"
android:textAppearance="?android:attr/textAppearanceMedium" />
</LinearLayout>
</ScrollView>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1" >
<Button
android:id="#+id/instructionsButtonPrevious"
style="#style/ButtonPrevious"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:text="#string/instructions_button_label_previous" />
<Button
android:id="#+id/instructionsButtonNext"
style="#style/ButtonNext"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:text="#string/instructions_button_label_next" />
</RelativeLayout>
</LinearLayout>
This only worked when I set the layout_weight of the bottom RelativeLayout to 1 (instead of 0) and for the ScrollView 0.1 (instead of 1). If I used the original values the RelativeLayout would take up all the screen. Could anyone explain to me why that is?
I also tried googling the issue and noticed people would suggest to set layout_height to 0dip which I tried but it also didn't work as expected.
Secondly, I tried adding the already mentioned ImageView to the bottom RelativeLayout. This, however, basically displays only the ImageView and not the buttons - or one of the buttons is on top of the image (hiding it). Why is that? Don't I specifically set the buttons to be placed below it?
What should the code look like in order for it to be doing what I expect it?
Further explanation:
Below are images that should help indicate what exactly I want to achieve. The green bits are the ScrollViews - I added them because Android devices tend to have diverse screen sizes. Their purpose is to present the content properly independently of the screen size, i.e. if the screen is small, the user will be able to scroll that part to read the entire text and view the image.
The red bit on the left (Intro) shows the ImageView that is supposed to always be at the bottom of the screen; it'll always be there, visible, and it's the green bit above it that will be movable.
If you take a look at the red bit on the right (Instructions), there's a Next button that's covering the image with the lorry/truck that was visible in the Intro screenshot. Now that's wrong - there should be 2 buttons BELOW the image, as seen on the last screenshot (the 2 blue rectangles).

How to make my layout to move completely left of screen like an animation in android?

I have a Relative Layout in my xml,I want to move that view to complete left like an animation(upto screen left). I want the complete inner layout to move like an animation upto screen end
I want to put animation for Relative layout with id="center"
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/img_1"
android:layout_centerInParent="true"
android:id="#+id/cartoon_image">
<RelativeLayout
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:background="#drawable/play_btn"
android:orientation="horizontal"
android:layout_centerInParent="true"
android:id="#+id/play_btn"
>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:visibility="gone"
android:gravity="center"
android:background="#drawable/circle"
android:id="#+id/center">
<ImageView
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_marginTop="15dp"
android:background="#drawable/like_small"
android:id="#+id/like_image_centre"
/>
<TextView
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_marginTop="15dp"
android:layout_below="#+id/like_image_centre"
android:text="36"
android:textSize="25dp"
android:textColor="#DF013A"
android:id="#+id/likes_count_centre"
/>
</RelativeLayout>
</RelativeLayout>
</RelativeLayout>
Please help in solving this issue

try this code in onCreate of your activity
by changing this functionTranslateAnimation(fromX,toX,fromY,toY) ,you can set the Animation you want to move the layout.
RelativeLayout mLayout = (RelativeLayout) findViewById(R.layout.center);
TranslateAnimation anim=new TranslateAnimation(0,80,0,0);
anim.setDuration(1500);
anim.setRepeatCount(Animation.INFINITE);
// anim.setRepeatMode(Animation.INFINITE);
anim.setRepeatMode(Animation.REVERSE);
mLayout.setAnimation(anim);