I have a fragment with an card view and when I try to add a FloatingActionButton thats cause the animation to fail.. The view just appear without an animation.. The Width and Height and radius is all correct but the animation dosen't run. This just occur the first time that the animation runs.. I use a regular Close button for this release..
CODE
public static void ToogleView(View myView, bool show, Func<int> param = null) {
// get the center for the clipping circle
int cx = myView.Width / 2;
int cy = myView.Height / 2;
// get the final radius for the clipping circle
float finalRadius = (float) Math.Sqrt(cx * cx + cy * cy);
// create the animator for this view (the start radius is zero)
Animator anim;
if (show) {
anim = ViewAnimationUtils.CreateCircularReveal (myView, cx, cy, 0, finalRadius);
} else {
anim = ViewAnimationUtils.CreateCircularReveal (myView, cx, cy, finalRadius, 0);
}
anim.SetDuration (500);
anim.AnimationEnd += (object sender, EventArgs e) => {
if(param != null) {
param();
}
if(!show) {
myView.Visibility = ViewStates.Invisible;
}
};
// make the view visible and start the animation
myView.Visibility = ViewStates.Visible;
anim.Start();
}
XML
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:id="#+id/mapFragmentRoot"
android:visibility="invisible"
android:layout_height="match_parent">
<android.support.v7.widget.CardView
card_view:cardElevation="4dp"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="35dp"
android:id="#+id/header"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_marginBottom="30dp"
card_view:cardBackgroundColor="#android:color/white"
card_view:cardCornerRadius="0dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_weight="0.5"
android:background="#android:color/darker_gray"
android:layout_height="0dp">
<RelativeLayout
android:id="#+id/mapFragmentMapCointatiner"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ProgressBar
style="#style/Widget.AppCompat.ProgressBar"
android:layout_width="wrap_content"
android:layout_centerInParent="true"
android:layout_height="wrap_content" />
<TextView
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:textColor="#android:color/white"
android:text="Hämtar närmaste hållplatser"
android:layout_centerInParent="true"
android:paddingTop="60dp"
android:background="#android:color/transparent" />
</RelativeLayout>
</LinearLayout>
<LinearLayout
android:layout_weight="0.5"
android:layout_width="match_parent"
android:layout_height="0dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ProgressBar
android:layout_centerInParent="true"
style="#style/Widget.AppCompat.ProgressBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</RelativeLayout>
</LinearLayout>
</LinearLayout>
</android.support.v7.widget.CardView>
<!--android.support.design.widget.FloatingActionButton
android:id="#+id/MapFragmentfabClose"
android:elevation="12dp"
card_view:backgroundTint="#android:color/holo_red_dark"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top|right"
android:layout_marginTop="5dp"
android:layout_marginRight="5dp"
android:src="#drawable/ic_close_white_48dp"
card_view:layout_anchor="#id/header"
card_view:layout_anchorGravity="top|right|end" /-->
</FrameLayout>
Related
Is there any way to keep the other, non-expanded items located at the bottom. In the second picture, the items shift up to the top--this is not desired.
Here is the item that is shown in the pictures above.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="vertical"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:padding="10dp"
android:layout_margin="10dp"
android:clickable="true"
android:focusable="true"
android:id="#+id/item_life_event_id"
android:background="#color/colorAccent"
android:layout_gravity="bottom">
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:cardCornerRadius="30dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="600dp"
android:orientation="horizontal"
android:id="#+id/massive_text_view"
android:visibility="gone">
<TextView
android:id="#+id/textViewEventDate"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="5"
android:text="TextView" />
<ImageView
android:id="#+id/imageEventNotice"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
tools:srcCompat="#tools:sample/avatars" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="60dp"
android:orientation="horizontal">
<ImageView
android:id="#+id/imageViewEventIcon"
android:layout_width="40dp"
android:layout_height="match_parent"
android:layout_weight="1"
tools:srcCompat="#tools:sample/avatars" />
<TextView
android:id="#+id/textViewEventTitle"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="5"
android:text="TextView" />
</LinearLayout>
</androidx.cardview.widget.CardView>
</LinearLayout>
Here is the parent layout where the recycler view is contained.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="bottom">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_weight="99">
<Button
android:id="#+id/buttonAdd"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Add"
/>
<Button
android:id="#+id/buttonDelete"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Remove" />
<Button
android:id="#+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Edit" />
</LinearLayout>
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recycler_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_weight="1"
android:focusable="true"
android:orientation="horizontal"
tools:listitem="#layout/item" />
</LinearLayout>
Here is my onScroll listener that is responsible for making the massive text view visible or gone:
#Override
public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
super.onScrolled(recyclerView, dx, dy);
int centerPos = layoutManager.findFirstCompletelyVisibleItemPosition();
View centerView = lifeTimelineRV.getLayoutManager().findViewByPosition(centerPos);
if (prevCenterPos != centerPos) {
// dehighlight the previously highlighted view
View prevView = lifeTimelineRV.getLayoutManager().findViewByPosition(prevCenterPos);
if (prevView != null) {
View previousView = prevView.findViewById(R.id.item_life_event_id);
previousView.setSelected(false);
previousView.findViewById(R.id.massive_text_view).setVisibility(View.GONE);
Log.d(TAG, "onScrolled: not focused" + prevCenterPos);
// run scale animation and make it bigger
// Animation anim = AnimationUtils.loadAnimation(getContext(), R.anim.scale_out_item);
// previousView.startAnimation(anim);
// anim.setFillAfter(true);
}
// highlight view in the middle
if (centerView != null) {
View currentView = centerView.findViewById(R.id.item_life_event_id);
currentView.setSelected(true);
Log.d(TAG, "onScrolled: focused" + centerPos);
currentView.findViewById(R.id.massive_text_view).setVisibility(View.VISIBLE);
// run scale animation and make it smaller
// Animation anim = AnimationUtils.loadAnimation(getContext(), R.anim.scale_in_item);
// centerView.startAnimation(anim);
// anim.setFillAfter(true);
}
prevCenterPos = centerPos;
}
}
Here is my desired output. Is something like this possible? The first picture on the left is what I want. The second is what currently happens.
I've been having some problems with this particular layout for the better part of an hour, and I can't seem to get it to layout as expected. I've done the usual googling around this sort of format for the tab, and nothing seems to be exactly what I'm after.
I have a TabLayout where the tabs are laid out vertically, with an ImageView and a TextView using the default View of the tab.
It looks like this:
Ideally all I want to be able to do is to mimic this layout and anchor a TextView as a badge counter to the top right of the icon.
Like this:
So with that in mind I found a decent approximation of how the default tab layouts actually appear and it used the default ID's so I don't have to assign them programmatically which I thought was pretty nifty:
<?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">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_marginBottom="4dp"
android:layout_marginTop="4dp">
<ImageView
android:id="#android:id/icon"
android:layout_gravity="center"
android:layout_width="24dp"
android:layout_height="24dp"
android:scaleType="centerInside" />
<TextView
android:id="#android:id/text1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#drawable/tab_selector"
android:ellipsize="end"
android:textAllCaps="true"
android:gravity="center"
android:maxLines="2" />
</LinearLayout>
<TextView
android:id="#+id/badgeCounter"
android:layout_width="wrap_content"
android:layout_height="20dp"
android:minWidth="20dp"
android:textAlignment="center"
android:background="#drawable/count_background"
android:textSize="15sp" />
</RelativeLayout>
After a lot of tinkering and trying different things, I got to 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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_marginBottom="4dp"
android:layout_marginTop="4dp"
android:layout_height="match_parent">
<FrameLayout
android:id="#+id/iconFrame"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="2dp"
android:layout_centerHorizontal="true"
android:layout_above="#android:id/text1">
<ImageView
android:id="#android:id/icon"
android:layout_width="24dp"
android:layout_height="24dp"
android:scaleType="centerInside"
android:src="#drawable/tab_home" />
</FrameLayout>
<TextView
android:id="#android:id/text1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#drawable/tab_selector"
android:ellipsize="end"
android:textAllCaps="true"
android:gravity="center"
android:maxLines="2"
android:text="Home"
android:layout_marginBottom="7dp"
android:layout_centerHorizontal="true"
android:layout_alignParentBottom="true" />
<TextView
android:id="#+id/badgeCounter"
android:layout_width="wrap_content"
android:layout_height="20dp"
android:minWidth="20dp"
android:layout_toRightOf="#+id/iconFrame"
android:textColor="#color/FeatureFontColour"
android:textAlignment="center"
android:background="#drawable/count_background"
android:textSize="15sp"
android:layout_alignTop="#+id/iconFrame" />
</RelativeLayout>
No matter what I try, I can't get the badge TextView to appear in the right place, I've tried removing the linear layout so that I can set it to Layout_RightOf the #android:id/icon, I've tried wrapping the icon in a frame and setting Layout_RightOf that instead just incase the icon was not positioned before the badge TextView was created etc.
This is as close as I can get (Spoiler, not that close):
Any help would be appreciated, I'm not sure what exactly I'm missing, but odds are it's something really obvious.
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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_marginBottom="4dp"
android:layout_marginTop="4dp"
android:clipChildren="false"
android:layout_height="match_parent">
<FrameLayout
android:id="#+id/iconFrame"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="10dp"
android:clipToPadding="false"
android:layout_marginBottom="2dp"
android:layout_centerHorizontal="true"
android:clipChildren="false"
android:layout_above="#android:id/text1">
<ImageView
android:id="#android:id/icon"
android:layout_width="24dp"
android:layout_height="24dp"
android:scaleType="centerInside"
android:src="#drawable/tab_home" />
<TextView
android:id="#+id/badgeCounter"
android:layout_width="wrap_content"
android:layout_height="20dp"
android:minWidth="20dp"
android:textColor="#color/FeatureFontColour"
android:textAlignment="center"
android:background="#drawable/count_background"
android:layout_gravity="right"
android:layout_marginRight="-10dp"
android:layout_marginTop="-10dp"
android:textSize="15sp"/>
</FrameLayout>
<TextView
android:id="#android:id/text1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#drawable/tab_selector"
android:ellipsize="end"
android:textAllCaps="true"
android:gravity="center"
android:maxLines="2"
android:text="Home"
android:layout_marginBottom="7dp"
android:layout_centerHorizontal="true"
android:layout_alignParentBottom="true" />
</RelativeLayout>
You can play with the margin right/top values to fine tune it.
Creating a layer drawable to display menu item on layer one and badge on top of it
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:drawable="#drawable/ic_cart"
android:gravity="center" />
<item
android:id="#+id/ic_badge"
android:drawable="#drawable/ic_cart" />
</layer-list>
Creating menu for our activity to display the count on the menu items.
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context="com.example.mobikul.MainActivity" >
<item
android:id="#+id/action_cart"
android:icon="#drawable/ic_menu_cart"
android:title="#string/action_cart"
app:showAsAction="always" />
Creating a flexible and efficient custom BagdeDrawable class to draw a view that looks like a count
public class BadgeDrawable extends Drawable {
private Paint mBadgePaint;
private Paint mBadgePaint1;
private Paint mTextPaint;
private Rect mTxtRect = new Rect();
private String mCount = "";
private boolean mWillDraw;
public BadgeDrawable(Context context) {
float mTextSize = context.getResources().getDimension(R.dimen.badge_text_size);
mBadgePaint = new Paint();
mBadgePaint.setColor(Color.RED);
mBadgePaint.setAntiAlias(true);
mBadgePaint.setStyle(Paint.Style.FILL);
mBadgePaint1 = new Paint();
mBadgePaint1.setColor(ContextCompat.getColor(context.getApplicationContext(), R.color.grey_ivory5));
mBadgePaint1.setAntiAlias(true);
mBadgePaint1.setStyle(Paint.Style.FILL);
mTextPaint = new Paint();
mTextPaint.setColor(Color.WHITE);
mTextPaint.setTypeface(Typeface.DEFAULT);
mTextPaint.setTextSize(mTextSize);
mTextPaint.setAntiAlias(true);
mTextPaint.setTextAlign(Paint.Align.CENTER);
}
#Override
public void draw(Canvas canvas) {
if (!mWillDraw) {
return;
}
Rect bounds = getBounds();
float width = bounds.right - bounds.left;
float height = bounds.bottom - bounds.top;
// Position the badge in the top-right quadrant of the icon.
/*Using Math.max rather than Math.min */
float radius = ((Math.max(width, height) / 2)) / 2;
float centerX = (width - radius - 1) +5;
float centerY = radius -5;
if(mCount.length() <= 2){
// Draw badge circle.
canvas.drawCircle(centerX, centerY, (int)(radius+7.5), mBadgePaint1);
canvas.drawCircle(centerX, centerY, (int)(radius+5.5), mBadgePaint);
}
else{
canvas.drawCircle(centerX, centerY, (int)(radius+8.5), mBadgePaint1);
canvas.drawCircle(centerX, centerY, (int)(radius+6.5), mBadgePaint);
}
mTextPaint.getTextBounds(mCount, 0, mCount.length(), mTxtRect);
float textHeight = mTxtRect.bottom - mTxtRect.top;
float textY = centerY + (textHeight / 2f);
if(mCount.length() > 2)
canvas.drawText("99+", centerX, textY, mTextPaint);
else
canvas.drawText(mCount, centerX, textY, mTextPaint);
}
/*
Sets the count (i.e notifications) to display.
*/
public void setCount(String count) {
mCount = count;
// Only draw a badge if there are notifications.
mWillDraw = !count.equalsIgnoreCase("0");
invalidateSelf();
}
#Override
public void setAlpha(int alpha) {
// do nothing
}
#Override
public void setColorFilter(ColorFilter cf) {
// do nothing
}
#Override
public int getOpacity() {
return PixelFormat.UNKNOWN;
}
}
for more referance visit this websitevisit here
The thing you missed here is as follows,
<?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">
<LinearLayout
android:id="#+id/lnrButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_marginBottom="4dp"
android:layout_marginTop="4dp">
<ImageView
android:id="#android:id/icon"
android:layout_gravity="center"
android:layout_width="24dp"
android:layout_height="24dp"
android:scaleType="centerInside" />
<TextView
android:id="#android:id/text1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#drawable/tab_selector"
android:ellipsize="end"
android:textAllCaps="true"
android:gravity="center"
android:maxLines="2" />
</LinearLayout>
<TextView
android:id="#+id/badgeCounter"
android:layout_width="wrap_content"
android:layout_height="20dp"
android:alignRight = "#+id/lnrButton"
android:alignTop = "#+id/lnrButton"
android:minWidth="20dp"
android:textAlignment="center"
android:background="#drawable/count_background"
android:textSize="15sp" />
</RelativeLayout>
Following is you missed
android:alignRight = "#+id/lnrButton"
android:alignTop = "#+id/lnrButton"
or if you want to come the badge on the image means, remove all LinearLayout and make it Relativelaout and instead of lnrButton use imageview id
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.
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
I want a relative layout to slide into a screen.
At the moment I set the layout to be below a layout that takes up the whole screen
<FrameLayout
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:animateLayoutChanges="true"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/ghostIv"
android:src="#drawable/results_ghost"
android:visibility="gone"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"/>
<ImageView
android:id="#+id/ghostShadowIv"
android:visibility="gone"
android:src="#drawable/results_ghost_shadow"
android:layout_centerHorizontal="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/ghostIv"/>
<TextView
android:id="#+id/noFilterTv"
android:textStyle="bold"
android:gravity="center_horizontal"
android:textColor="#color/LightTextGrey"
android:visibility="gone"
android:text="#string/no_filters"
android:paddingLeft="50dp"
android:paddingRight="50dp"
android:layout_centerHorizontal="true"
android:layout_below="#+id/ghostShadowIv"
android:layout_height="wrap_content"
android:layout_width="wrap_content"/>
<com.allryder.android.ui.views.ScheduleView
android:visibility="invisible"
android:background="#color/White"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/scheduleView"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"/>
<View
android:id="#+id/shadowV"
android:visibility="gone"
android:layout_above="#+id/ratingRl"
android:layout_height="4dp"
android:layout_width="match_parent"
android:background="#drawable/bottom_shadow"/>
<RelativeLayout
android:id="#+id/ratingRl"
android:layout_below="#+id/scheduleView"
android:background="#color/White"
android:clickable="true"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:background="#drawable/time_view_selector"
android:padding="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:id="#+id/ratePromptTv"
android:layout_toLeftOf="#+id/closeRatingIv"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:gravity="center|left"
android:text="#string/rate_prompt"/>
<ImageView
android:background="#drawable/time_view_selector"
android:padding="10dp"
android:clickable="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/ratePromptTv"
android:layout_alignBottom="#+id/ratePromptTv"
android:id="#+id/closeRatingIv"
android:layout_centerVertical="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:src="#drawable/search_clear"/>
</RelativeLayout>
</RelativeLayout>
</FrameLayout>
<fragment android:id="#+id/filters_drawer"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="end"
android:name="com.allryder.android.ui.fragments.FiltersDrawerFragment"/>
Then make this call
ratingRl.animate().translationY(- ratingRl.getHeight());
But it doesn't slide into the screen. If the view is in the screen to start off with, the view does animate. What is the problem?
ratingRl.animate().translationY(- ratingRl.getHeight()).setDuration(300).start();
I have done similar task in my recent project.
background = (RelativeLayout) findViewById(R.id.slidingBackground);
positionOffScreen(background);
private void positionOffScreen(View v){
View myView = v;
int amountOffscreen = (int)(getScreenWidth());
boolean offscreen = true;
int xOffset = (offscreen) ? amountOffscreen : 0;
RelativeLayout.LayoutParams rlParams = (RelativeLayout.LayoutParams)myView.getLayoutParams();
rlParams.setMargins(-1*xOffset, 0, xOffset, 0);
myView.setLayoutParams(rlParams);
}
protected float getScreenWidth() {
DisplayMetrics displaymetrics = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(displaymetrics);
return (float) displaymetrics.widthPixels;
}
When you want to start animation call this method
private void startAnimation(int duration){
TranslateAnimation a = new TranslateAnimation(Animation.ABSOLUTE,0,Animation.ABSOLUTE,getScreenWidth(),Animation.ABSOLUTE,0,Animation.ABSOLUTE,0);
a.setDuration(duration);
a.setFillAfter(false);
background.startAnimation(a);
}
When you want to interrupt animation
background.clearAnimation();
Here is layout example. The sliding view has to be placed on RelativeLayout.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/background" >
<RelativeLayout
android:id="#+id/slidingBackground"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#64000000"
android:orientation="vertical" >
</RelativeLayout>
...
And this is the app link where I use this sliding view.