Expand CadrView to reveal TextView - android

I'm trying to implement and expandable CardView, but I'm having proplems
heres my xml file for the cardview:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/card_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_marginTop="8dp"
android:clickable="true"
android:elevation="5dp"
android:foreground="?android:attr/selectableItemBackground"
android:orientation="vertical"
android:stateListAnimator="#drawable/cardview_lift_on_touch">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<com.android.volley.toolbox.NetworkImageView
android:id="#+id/product_image"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:scaleType="centerCrop"
android:src="#drawable/default_network_image"/>
<TextView
android:id="#+id/product_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="16dp"
android:paddingBottom="16dp"
android:paddingLeft="16dp"
android:paddingTop="24dp"
android:text="Product Name"
android:textColor="#000000"
android:textSize="24dp"
android:textStyle="bold" />
<TextView
android:id="#+id/product_description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingBottom="16dp"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:text="A buyer persona is an imaginary customer. It is the person for whom you've developed your product and to whom you'd love to sell it (of course!). He or she represents your target audience, but is much more real than a vague description of some demographics."
android:textColor="#000000"
android:textSize="14dp"
android:visibility="visible" />
<TextView
android:id="#+id/product_url"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingBottom="24dp"
android:paddingLeft="16dp"
android:text="example.syriatel.sy/akrab_eleik"
android:textColor="#0048ff"
android:textSize="14dp" />
</LinearLayout>
</android.support.v7.widget.CardView>
I'm trying to expand the "product description" TextView when the CardView is clicked by passing it to the following method:
public static void expand(final View v) {
final int initialHeight = v.getHeight();
v.measure(LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.WRAP_CONTENT);
final int targetHeight = v.getMeasuredHeight();
v.getLayoutParams().height = 1;
v.setVisibility(View.VISIBLE);
Animation a = new Animation() {
#Override
protected void applyTransformation(float interpolatedTime, Transformation t) {
v.getLayoutParams().height = interpolatedTime == 1
? LinearLayout.LayoutParams.WRAP_CONTENT
: (int) (targetHeight * interpolatedTime);
v.requestLayout();
}
#Override
public boolean willChangeBounds() {
return true;
}
};
// 1dp/ms
a.setDuration((int) ((initialHeight / v.getContext().getResources().getDisplayMetrics().density))/10);
v.startAnimation(a);
}
The resulting animation is initially smooth but suddenly expands the view to full hight at the end
I got the code I'm using from this answer:
https://stackoverflow.com/a/13381228/5716823
Reading the comments didn't help.

Related

Not shown TextView after setting VISIBLE from GONE in animation

trying to make showing LinarLayout from GONE state to VISIBLE with "roll down" animation. On this Layout exist TextView. Seems to all work fine but, a TextView not shown after animation.
What I do wrong?
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="gone"
android:id="#+id/ll_info">
<TextView
android:id="#+id/bayer_note"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:text="#string/buyer_note"/>
<RelativeLayout
android:id="#+id/button_continue"
android:layout_width="match_parent"
android:layout_height="54dp"
android:layout_centerHorizontal="true"
android:layout_marginLeft="#dimen/activity_horizontal_margin"
android:layout_marginRight="#dimen/activity_horizontal_margin"
android:background="#drawable/button_register"
android:drawableEnd="#drawable/ic_arrow_forward_white_24dp">
<TextView
android:id="#+id/btn_cont_caption"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:text="Войти"
android:textColor="#android:color/white"
android:textSize="20sp"
android:fontFamily="fonts/SF-UI-Display-Regular.ttf"
android:layout_centerInParent="true" />
<ImageView
android:layout_width="25dp"
android:layout_height="25dp"
android:id="#+id/imageView"
android:layout_centerVertical="true"
android:layout_alignParentEnd="false"
android:src="#drawable/ic_door"
android:layout_toRightOf="#+id/btn_cont_caption"
android:layout_marginLeft="10dp"
android:scaleType="fitCenter" />
</RelativeLayout>
</LinearLayout>
And animation code:
final LinearLayout ll_info = (LinearLayout)findViewById(R.id.ll_info);
class scaleAnimation extends Animation {
public LinearLayout ll;
public int newHeight;
public void scaleTopHeight(int height)
{
newHeight = height;
}
public void setLayout(LinearLayout layout) {
ll = layout;
}
}
final LinearLayout ll_info = (LinearLayout)findViewById(R.id.ll_info);
scaleAnimation h = new scaleAnimation() {
#Override
protected void applyTransformation(float interpolatedTime, Transformation t) {
ll.getLayoutParams().height = interpolatedTime == 1
? LinearLayout.LayoutParams.WRAP_CONTENT
: (int)(newHeight * interpolatedTime);
ll.requestLayout();
}
};
h.setDuration(300);
h.setLayout(ll_info);
ll_info.setVisibility(View.VISIBLE);
ll_info.measure(View.MeasureSpec.makeMeasureSpec(((LinearLayout)ll_info.getParent()).getWidth(), View.MeasureSpec.AT_MOST), View.MeasureSpec.makeMeasureSpec(((LinearLayout)ll_info.getParent()).getHeight(), View.MeasureSpec.AT_MOST));
h.scaleTopHeight(ll_info.getMeasuredHeight());
ll_info.getLayoutParams().height=1;
ll_info.startAnimation(h);
<RelativeLayout
android:id="#+id/button_continue"
android:layout_width="match_parent"
android:layout_height="54dp"
**android:layout_centerHorizontal="true"** /////
remove this
android:layout_marginLeft="#dimen/activity_horizontal_margin"
android:layout_marginRight="#dimen/activity_horizontal_margin"
android:background="#drawable/button_register"
android:drawableEnd="#drawable/ic_arrow_forward_white_24dp">
<TextView
android:id="#+id/btn_cont_caption"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:text="Войти"
android:textColor="#android:color/white"
android:textSize="20sp"
android:fontFamily="fonts/SF-UI-Display-Regular.ttf"
android:layout_centerInParent="true" />
<ImageView
android:layout_width="25dp"
android:layout_height="25dp"
android:id="#+id/imageView"
android:layout_centerVertical="true"
android:layout_alignParentEnd="false"
android:src="#drawable/ic_door"
android:layout_toRightOf="#+id/btn_cont_caption"
android:layout_marginLeft="10dp"
android:scaleType="fitCenter" />
</RelativeLayout>
i think this is your xml file issue ,your relativelayout in center_horizontal and all the childs are in center in parent.so textview hides over imageview. Try it and let me know.

Make Fragment Grows and Show More Info

my application have 2 fragments:
1 - Have several fields to insert info for a query, and initially it shows only a field to input the name and a button that make it grows;
2 - A list view that would show the results for the query.
I'm using Visibility.GONE to make the trick (not show the other fields, and when the user press the button, they appear):
I have several of these
<android.support.v7.widget.LinearLayoutCompat
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
tools:context="com.tcgapp.myrium.fowhelper.MainActivity"
tools:showIn="#layout/activity_main"
android:orientation="vertical"
android:id="#+id/fragment_search_area"
>
<!--android:background="#c94040" -->
<!-- Name of Card and button to expand the view-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_alignParentTop="true"
android:id="#+id/layout_name_search"
android:background="#android:color/darker_gray">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/label_name"
android:text="#string/name_label"
android:textSize="20sp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:textStyle="bold"
/>
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/text_name"
android:hint="#string/name_hint"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:singleLine="true"
android:layout_weight="0.90" />
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/button_expand"
android:src="#drawable/ic_arrow_downward_black_24dp" />
</LinearLayout>
<!-- Type Set and Format-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/search_tags_area"
android:orientation="horizontal"
android:background="#android:color/holo_blue_dark">
<Spinner
android:id="#+id/spinner_type"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:paddingLeft="10dp"
android:paddingRight="10dp"/>
<util.MultiSpinner
android:id="#+id/spinner_rarity"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:paddingLeft="10dp"
android:paddingRight="10dp"/>
<util.MultiSpinner
android:id="#+id/spinner_set"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:paddingLeft="10dp"
android:paddingRight="10dp"/>
<Spinner
android:id="#+id/spinner_format"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:paddingLeft="10dp"
android:paddingRight="10dp"/>
</LinearLayout>
<!-- Card Text Field-->
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/edit_card_text"
android:hint="#string/field_text"
android:paddingLeft="10dp"
android:paddingRight="10dp"/>
<!-- Spinners-->
<!-- Attribute and choices-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_alignParentTop="true"
android:id="#+id/layout_attribute"
android:background="#android:color/darker_gray"
android:visibility="gone">
<util.MultiSpinner
android:id="#+id/multi_spinner_attribute"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:paddingLeft="10dp"
android:paddingRight="10dp"/>
<Spinner
android:id="#+id/spinner_choices_to_query_attribute"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:paddingLeft="10dp"
android:paddingRight="10dp"/>
</LinearLayout>
<!-- Now the query fields-->
<!-- Atk Def-->
<LinearLayout
android:id="#+id/layout_atkdef"
android:visibility="gone"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:background="#75b194"
>
<TextView
android:id="#+id/text_atk"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/field_atk"
android:gravity="left"
android:textStyle="bold"
android:layout_weight="2"
android:textSize="15sp"
android:paddingLeft="10dp"/>
<Spinner
android:id="#+id/spinner_atk"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
/>
<android.support.v7.widget.AppCompatEditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="2"
android:inputType="numberSigned"/>
<!-- Atk field-->
<TextView
android:id="#+id/text_def"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/field_def"
android:gravity="left"
android:textStyle="bold"
android:layout_weight="2"
android:textSize="15sp"
android:paddingLeft="10dp"
/>
<Spinner
android:id="#+id/spinner_def"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
/>
<android.support.v7.widget.AppCompatEditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="2"
android:inputType="numberSigned"/>
</LinearLayout>
<!-- SubType and CMC-->
<LinearLayout
android:id="#+id/layout_subtype_cmc"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="gone"
android:background="#75b194"
android:orientation="horizontal">
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="#string/field_subtype"
android:layout_weight="2"
android:textSize="15sp"
android:paddingLeft="10dp"
android:textStyle="bold"/>
<android.support.v7.widget.AppCompatEditText
android:layout_width="0dp"
android:layout_height="wrap_content"
android:singleLine="true"
android:layout_weight="2" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/field_cmc"
android:layout_weight="1"
android:textSize="15sp"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:textStyle="bold"/>
<Spinner
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:id="#+id/spinner_cmc"/>
</LinearLayout>
<!-- Card Flavor e Code-->
<LinearLayout
android:id="#+id/layout_flavor_code"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="gone"
android:background="#75b194"
android:orientation="horizontal">
<EditText
android:layout_width="0dp"
android:layout_height="wrap_content"
android:id="#+id/edit_card_flavor"
android:hint="#string/field_flavor"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:layout_weight="1"
android:singleLine="true"/>
<EditText
android:layout_width="0dp"
android:layout_height="wrap_content"
android:id="#+id/edit_card_code"
android:hint="#string/field_code"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:layout_weight="1"
android:singleLine="true"/>
</LinearLayout>
And on Java code, i have an animator object, and this is its AnimationEnd():
#Override
public void onClick(View v) {
int newWeight = isExpanded ? 0 : 60;
ViewWeightAnimationWrapper animationWrapper = new ViewWeightAnimationWrapper(getView());
ObjectAnimator anim = ObjectAnimator.ofFloat(animationWrapper,
"weight",
animationWrapper.getWeight(),
newWeight);
anim.setDuration(500);
anim.addListener(new AnimatorListenerAdapter() {
public void onAnimationStart(Animator animation) {
super.onAnimationStart(animation);
// if (!isExpanded){
// getView().findViewById(R.id.layout_atkdef).setVisibility(View.INVISIBLE);
// getView().findViewById(R.id.layout_subtype_cmc).setVisibility(View.INVISIBLE);
// getView().findViewById(R.id.layout_attribute).setVisibility(View.INVISIBLE);
// getView().findViewById(R.id.layout_flavor_code).setVisibility(View.INVISIBLE);
// }
}
#Override
public void onAnimationEnd (Animator animation){
super.onAnimationEnd(animation);
if (isExpanded) {
imageButtonToggle.setImageResource(R.drawable.ic_arrow_downward_black_24dp);
getView().findViewById(R.id.layout_atkdef).setVisibility(View.GONE);
getView().findViewById(R.id.layout_subtype_cmc).setVisibility(View.GONE);
getView().findViewById(R.id.layout_attribute).setVisibility(View.GONE);
getView().findViewById(R.id.layout_flavor_code).setVisibility(View.GONE);
} else {
imageButtonToggle.setImageResource(R.drawable.ic_arrow_upward_black_24dp);
getView().findViewById(R.id.layout_atkdef).setVisibility(View.VISIBLE);
getView().findViewById(R.id.layout_subtype_cmc).setVisibility(View.VISIBLE);
getView().findViewById(R.id.layout_attribute).setVisibility(View.VISIBLE);
getView().findViewById(R.id.layout_flavor_code).setVisibility(View.VISIBLE);
}
isExpanded = !isExpanded;
}
}
);
anim.start();
}
}
This is the way to hide the fields and show only when the user presses the expand button, or is a better way?
UPDATE: Providing full code.
Assuming you're asking if there's a nicer way of expanding/hiding an area with input, I'll share my implementation using your variables as best I can. I'll make some necessary notes as well.
//consider changing imageButtonToggle to a container view with an image in it
//in this example I'll use carrotImage as the image contained within imageButtonToggle
//formContainer contains all the views you're toggling from GONE to VISIBLE.
imageButtonToggle.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
if (!isExpanded) {
ViewAnimationHelper
.expand(formContainer, 300, false);
} else {
ViewAnimationHelper.collapse(formContainer, 300);
}
carrotImage.animate().rotation(ROTATION_COUNT);
ROTATION_COUNT += 180f;
//Silly check.. but better safe than sorry.
if (ROTATION_COUNT >= Float.MAX_VALUE)
ROTATION_COUNT = 0f;
isExpanded= !isExpanded;
}
});
public class ViewAnimationHelper {
/**
* Easy way to expand a given view after measuring with
* v.measure(LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT);
*
* #param v
* #param duration
*/
public static void expand(final View v, int duration,
boolean bStartFromZeroHeight) {
v.measure(LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT);
final int targetHeight = v.getMeasuredHeight();
if (bStartFromZeroHeight)
v.getLayoutParams().height = 0;
v.setVisibility(View.VISIBLE);
Animation a = new Animation() {
#Override
protected void applyTransformation(float interpolatedTime,
Transformation t) {
v.getLayoutParams().height = interpolatedTime == 1 ? LayoutParams.WRAP_CONTENT
: (int) (targetHeight * interpolatedTime);
v.requestLayout();
}
#Override
public boolean willChangeBounds() {
return true;
}
};
// 1dp/ms
a.setDuration(duration);
v.startAnimation(a);
}
/**
* Easy way to just collapse any given view and any given speed
*
* #param v
* #param duration
*/
public static void collapse(final View v, int duration) {
final int initialHeight = v.getMeasuredHeight();
Animation a = new Animation() {
#Override
protected void applyTransformation(float interpolatedTime,
Transformation t) {
if (interpolatedTime == 1) {
v.setVisibility(View.GONE);
} else {
v.getLayoutParams().height = initialHeight
- (int) (initialHeight * interpolatedTime);
v.requestLayout();
}
}
#Override
public boolean willChangeBounds() {
return true;
}
};
// 1dp/ms
a.setDuration(duration);
v.startAnimation(a);
}
}

Android Animate GONE visibility

in my application i have RelativeLayout with any widgets,into layout and i want to move up that by xml animate. RelativeLayout visibility is GONE and that must be set visibilty to GONE again and move that to up.
my problem is this, after set again visibilty to GONE move animate dont work and after change visibilty to VISIBLE, RelativeLayout can be show but only thats childeren move up, i want to RelativeLayout with all chileds move to top. how to resolve this problem?
XML animation:
<?xml version="1.0" encoding="utf-8"?>
<set
xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="#android:anim/linear_interpolator"
android:fillAfter="true">
<translate
android:fromYDelta="70%p"
android:toYDelta="0%p"
android:duration="800" />
</set>
animate code:
animMoveUp = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.animation_move_up);
uiFiller.toolbarLinearlayoutIcons.setVisibility(View.VISIBLE);
uiFiller.toolbarLinearlayoutIcons.startAnimation(animMoveUp);
my layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/main"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#ffe67f24"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/main_tsms_actionbar_background" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="38dp"
android:layout_height="38dp" />
<LinearLayout
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1"
android:gravity="right"
android:orientation="vertical" >
<TextView
android:id="#+id/txtSmsReceiveSlaveMobile"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1" />
<TextView
android:id="#+id/txtSmsReceiveSlaveContactName"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="right|center_vertical"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#f6f6f6"
android:textSize="#dimen/normal_text_size" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#ffffff"
android:minHeight="150dp"
android:orientation="horizontal" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:orientation="vertical" >
<ListView
android:id="#+id/lvSmsReceiveSlaveList"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:divider="#null"
android:listSelector="#android:color/transparent"
android:stackFromBottom="true"
tools:listitem="#layout/activity_sms_receive_slave_item" >
</ListView>
</LinearLayout>
</LinearLayout>
<TextView
android:layout_width="fill_parent"
android:layout_height="1dp"
android:background="#drawable/gradient_divider" />
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="50dp" >
<TextView
android:id="#+id/sms_counter"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="false"
android:layout_alignParentTop="false"
android:gravity="left"
android:paddingLeft="3dp"
android:paddingTop="3dp"
android:textColor="#ff787878"
android:textSize="9sp" />
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#ffffff" >
<ImageButton
android:id="#+id/imgbtn_send_sms"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginTop="8dp"
android:background="#drawable/icon_send_sms" />
<EditText
android:id="#+id/smsBody"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_gravity="right|center_vertical"
android:layout_weight="1"
android:background="#ffffff"
android:ems="10"
android:gravity="right|top"
android:hint="#string/hint_enter_text"
android:paddingBottom="5dp"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:paddingTop="5dp"
android:textColor="#000000"
android:textSize="#dimen/small_text_size"
android:windowSoftInputMode="adjustResize" >
<requestFocus />
</EditText>
</LinearLayout>
</RelativeLayout>
<RelativeLayout
android:id="#+id/toolbarLinearlayoutIcons"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="bottom"
android:animateLayoutChanges="true"
android:visibility="gone" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="48dp"
android:orientation="horizontal" >
<ImageButton
android:id="#+id/imgbtn_copy_to_clipboard"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="10dp"
android:background="#drawable/icon_copy_to_clipboard" />
<TextView
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1" />
<ImageButton
android:id="#+id/imgbtn_delete_sms"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="#drawable/icon_delete_sms" />
<TextView
android:id="#+id/TextView02"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1" />
<ImageButton
android:id="#+id/imgbtn_share_sms"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="#drawable/icon_share_sms" />
<TextView
android:id="#+id/TextView03"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1" />
<ImageButton
android:id="#+id/imgbtn_forward_sms"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginRight="10dp"
android:background="#drawable/icon_forward_sms" />
</LinearLayout>
</RelativeLayout>
</LinearLayout>
in this layout i want to move toolbarLinearlayoutIcons id
You can do with 1 line in xml just put this on parent layout
android:animateLayoutChanges="true"
Use below methods to expand and collapse the desired view :
public void expand(final View v) {
v.measure(LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT);
final int targtetHeight = v.getMeasuredHeight();
if (v.isShown()) {
collapse(v);
} else {
v.getLayoutParams().height = 0;
v.setVisibility(View.VISIBLE);
Animation a = new Animation() {
#Override
protected void applyTransformation(float interpolatedTime,
Transformation t) {
v.getLayoutParams().height = interpolatedTime == 1 ? LayoutParams.WRAP_CONTENT
: (int) (targtetHeight * interpolatedTime);
v.requestLayout();
}
#Override
public boolean willChangeBounds() {
return true;
}
};
a.setDuration((int) (targtetHeight + 500));
v.startAnimation(a);
}
}
public void collapse(final View v) {
final int initialHeight = v.getMeasuredHeight();
Animation a = new Animation() {
#Override
protected void applyTransformation(float interpolatedTime,
Transformation t) {
if (interpolatedTime == 1) {
v.setVisibility(View.GONE);
} else {
v.getLayoutParams().height = initialHeight
- (int) (initialHeight * interpolatedTime);
v.requestLayout();
}
}
#Override
public boolean willChangeBounds() {
return true;
}
};
a.setDuration((int) (v.getLayoutParams().height + 500));
v.startAnimation(a);
}

background color stop my animation

I have a problem with a button , if add him background my animation stop work.
Here is xml:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:background="#drawable/coinsbackground" >
<LinearLayout
android:id="#+id/instructiuni"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0" >
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="vertical" >
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:src="#drawable/instructiuneinceput" />
<TextView
android:id="#+id/instructiuniInceputHtml"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text=""
android:background="#8CFAFAFA" />
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:src="#drawable/terminareinceput" />
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:src="#drawable/intructiuni" />
<TextView
android:id="#+id/instructiuniHtml"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text=""
android:background="#8CFAFAFA" />
<Button
android:id="#+id/back_instructiuni"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Back >>"
android:background="#5B52D7" />
</LinearLayout>
</ScrollView>
</LinearLayout>
<LinearLayout
android:id="#+id/menuButton"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:gravity="center"
>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical"
android:layout_weight="1" >
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical"
android:layout_weight="18" >
<Button
android:id="#+id/playgame"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Play"
android:textStyle="bold" />
<Button
android:id="#+id/instructions"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Instructions"
android:textStyle="bold" />
<Button
android:id="#+id/settings"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Settings"
android:textStyle="bold"
android:background="#5B52D7" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical"
android:layout_weight="1" >
</LinearLayout>
</LinearLayout>
</LinearLayout>
My animation class:
public class FlipWidthAnimation extends Animation {
private int startWidth;
private int deltaWidth; // distance between start and end height
private View view;
/**
* constructor, do not forget to use the setParams(int, int) method before
* starting the animation
* #param v
*/
public FlipWidthAnimation(View v) {
this.view = v;
}
#Override
protected void applyTransformation(float interpolatedTime, Transformation t) {
view.getLayoutParams().width = (int) (startWidth + deltaWidth * interpolatedTime);
view.requestLayout();
}
/**
* set the starting and ending height for the resize animation
* starting height is usually the views current height, the end height is the height
* we want to reach after the animation is completed
* #param start height in pixels
* #param end height in pixels
*/
public void setParams(int start, int end) {
this.startWidth = start;
deltaWidth = end - startWidth;
}
/**
* set the duration for the hideshowanimation
*/
#Override
public void setDuration(long durationMillis) {
super.setDuration(durationMillis);
}
#Override
public boolean willChangeBounds() {
return true;
}
}
and here event:
if(v.getId() == R.id.instructions){
LinearLayout instructiuni = (LinearLayout)findViewById(R.id.instructiuni);
LinearLayout.LayoutParams lp = (LinearLayout.LayoutParams) instructiuni.getLayoutParams();
FlipWidthAnimation a = new FlipWidthAnimation(instructiuni);
a.setDuration(1000);
a.setParams(lp.width, getWindowManager().getDefaultDisplay().getWidth());
instructiuni.startAnimation(a);
}
he come in event is not a problem i debuged i see no error , but animation not started , but for example if click on settings animation started if was presset instructions before press settings. realy have no ideea why .
Solution was to give invalidate() my button: here is link who help me

Android View Animation

i've been scrounging the internet for a while now and have been unable to find s viable solution for my animation problem.
I have a list view where when you click on one of the items, more information animates from the bottom to give you a few lines of additional information. That is simply a linearlayout that i have inside the XML file im using for these list items, here:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:id="#+id/friendActivityList"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/friendInfo"
android:background="#color/grey"
android:orientation="vertical"
android:visibility="gone" >
<RelativeLayout
android:id="#+id/RelativeLayout04"
android:layout_width="match_parent"
android:layout_height="#dimen/freind_activity_list_height" >
<ImageView
android:id="#+id/ImageView04"
android:layout_width="wrap_content"
android:layout_height="25dp"
android:layout_margin="5dp"
android:src="#drawable/logo_d" />
<TextView
android:id="#+id/TextView04"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toRightOf="#+id/ImageView04"
android:text="TextView"
android:textColor="#color/black"
android:textSize="17dp" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/RelativeLayout03"
android:layout_width="match_parent"
android:layout_height="#dimen/freind_activity_list_height" >
<ImageView
android:id="#+id/ImageView03"
android:layout_width="wrap_content"
android:layout_height="25dp"
android:layout_margin="5dp"
android:src="#drawable/logo_d" />
<TextView
android:id="#+id/TextView03"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toRightOf="#+id/ImageView03"
android:text="TextView"
android:textColor="#color/black"
android:textSize="17dp" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/RelativeLayout02"
android:layout_width="match_parent"
android:layout_height="#dimen/freind_activity_list_height" >
<ImageView
android:id="#+id/ImageView02"
android:layout_width="wrap_content"
android:layout_height="25dp"
android:layout_margin="5dp"
android:src="#drawable/logo_d" />
<TextView
android:id="#+id/TextView02"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toRightOf="#+id/ImageView02"
android:text="TextView"
android:textColor="#color/black"
android:textSize="17dp" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/relativeLayout1"
android:layout_width="match_parent"
android:layout_height="#dimen/freind_activity_list_height" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="25dp"
android:layout_margin="5dp"
android:src="#drawable/logo_d" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toRightOf="#id/imageView1"
android:text="TextView"
android:textColor="#color/black"
android:textSize="17dp" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/RelativeLayout01"
android:layout_width="match_parent"
android:layout_height="#dimen/freind_activity_list_height">
<ImageView
android:id="#+id/ImageView01"
android:layout_width="wrap_content"
android:layout_height="25dp"
android:layout_margin="5dp"
android:src="#drawable/logo_d" />
<TextView
android:id="#+id/TextView01"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toRightOf="#+id/ImageView01"
android:text="TextView"
android:textColor="#color/black"
android:textSize="17dp" />
</RelativeLayout>
</LinearLayout>
<RelativeLayout
android:id="#+id/friendInfo"
android:layout_width="wrap_content"
android:layout_height="60dp"
android:background="#drawable/bg_list_item_n" >
<ImageView android:id="#+id/imgCompany"
android:layout_marginLeft="5dp"
android:layout_centerVertical="true"
android:layout_width="60dp"
android:src="#drawable/ic_launcher"
android:scaleType="centerInside"
android:layout_alignParentLeft="true"
android:layout_height="50dp">
</ImageView>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="60dp"
android:layout_toRightOf="#id/imgCompany"
android:background="#android:color/transparent"
android:gravity="left|center"
android:orientation="vertical"
android:paddingLeft="5dp" >
<TextView android:id="#+id/lblCompanyName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/white"
android:textStyle="bold"
android:textSize="13dp"
android:text="Company Name">
</TextView>
<TextView android:id="#+id/lblReawrdDesc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/white"
android:textSize="13dp"
android:text="Reawrd Description">
</TextView>
<TextView android:id="#+id/lblScores"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/white"
android:textSize="13dp"
android:singleLine="true"
android:text="My Score: 13434 | Top Score: 344425">
</TextView>
</LinearLayout>
</RelativeLayout>
</RelativeLayout>
Most of this is just place holder information so that i can get the animation to work correctly. Here is the code that im using for the animation:
listviewFriends.setOnItemClickListener(new OnItemClickListener() {//this is the listView that im animating inside of
public void onItemClick(AdapterView<?> parent, View view,final int pos, long id) {
Log.v("ListItemClicked", "this position was clicked: "+pos);
if(friendInfoList != null){
friendInfoList.clearAnimation();//this is the new view that gets animated and is supposed to push everything below it out of the way
friendInfoList.setVisibility(View.GONE);
}
friendInfoList = (LinearLayout) view.findViewById(R.id.friendActivityList);
friendInfoList.setVisibility(View.VISIBLE);
friendInfoList.startAnimation(infoAnim);
}
});
infoAnim = new TranslateAnimation(0,0, -150, 0);//this is the animation im using
infoAnim.setDuration(1000);
infoAnim.setFillAfter(true);
No the result of this is that when i click on the list view item the entire space that the supposed-to-be-animated view takes up at the end is white while the view animates from the top down. The location is correct, but i want it to animate and push everything below it out of the way, instead it instantly pushes everything out of the way then animates to fill that space.
Any idea how i can get it to push everything out of the way during the animation instead of immediately? Is it even possible to achieve this effect? any help is greatly appreciated.
Also, I know how i can make it simply animate ontop of the other views, but i need it to actually push everything out of the way.
The trick with this is to create your own Animation subclass.
public class ExpandAnimation extends Animation
{
private int _targetHeight;
private View _view;
private boolean _down;
public ExpandAnimation(View view, int targetHeight)
{
_view = view;
_targetHeight = targetHeight;
}
#Override
protected void applyTransformation(float interpolatedTime, Transformation t)
{
int newHeight;
if(_down)
{
newHeight = (int) (_targetHeight * interpolatedTime);
}
else
{
newHeight = (int) (_targetHeight * (1 - interpolatedTime));
}
_view.getLayoutParams().height = newHeight;
_view.requestLayout();
}
public ExpandAnimation expand()
{
_down = true;
return this;
}
public ExpandAnimation collapse()
{
_down = false;
return this;
}
#Override
public void initialize(int width, int height, int parentWidth, int parentHeight)
{
super.initialize(width, height, parentWidth, parentHeight);
}
#Override
public boolean willChangeBounds()
{
return true;
}
}
Then you can apply that to your view that should expand:
public void togglePreview()
{
if(_expanded) _preview.startAnimation(_animation.collapse());
else _preview.startAnimation(_animation.expand());
_expanded = !_expanded;
getParent().requestLayout();
}

Categories

Resources