I have a LinearLayout which contains an image and a ListView. In my code I'm trying to set the layout params of the LinearLayout. Unfortunately, when I do that I'm no longer able to scroll in my ListView. Here are the relevant snippets:
private class ExpandAnimation extends Animation {
private final View mContent;
private final int mStartHeight;
private final int mDeltaHeight;
public ExpandAnimation(int _startHeight, int _endHeight, View _content) {
mStartHeight = _startHeight;
mDeltaHeight = _endHeight - _startHeight;
mContent = _content;
}
#Override
protected void applyTransformation(float interpolatedTime, Transformation t) {
LinearLayout.LayoutParams lp = new LinearLayout.LayoutParams(mContent.getLayoutParams());
lp.height = (int) (mStartHeight + mDeltaHeight * interpolatedTime);
mContent.setLayoutParams(lp);
if(interpolatedTime == 1.0f) {
lp = new LinearLayout.LayoutParams(mListLayout.getLayoutParams());
View mainLayout = mActivity.findViewById("id goes here");
lp.height = mainLayout.getBottom();
mListLayout.setLayoutParams(lp); // <-- Calling setLayoutParams here
}
}
#Override
public boolean willChangeBounds() {
return true;
}
}
How I create my animation Animation a = new ExpandAnimation(initialHeight, targetHeight, v); and the layout:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/some_id_1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:orientation="vertical" >
// layout
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_below="#id/some_id_2"
android:orientation="vertical" >
// more layout
<LinearLayout
android:id="#+id/some_id_3"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
// even more layout
<ListView
android:id="#+id/some_id_4"
android:layout_width="fill_parent"
android:layout_height="fill_parent" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
Can anyone shed some light on this?
Related
So, situation is this:
I need to implement AppBar scroll behaviour in my main activity, but, I already have CoordinatorLayout and AppBarLayout in my fragment with the same scroll behaviour.
Here is the xml from both of the layouts:
activity_main:
<android.support.design.widget.CoordinatorLayout 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"
android:background="#EBEDEC">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/toolbar_open_nav"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:src="#drawable/filter_icon" />
<RelativeLayout
android:id="#+id/main_activity_images_relative"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/toolbar_fencity_image"
android:layout_width="200dp"
android:layout_height="match_parent"
android:layout_centerInParent="true"
android:layout_margin="#dimen/layout_padding"
android:src="#drawable/toolbarimg"
android:visibility="gone" />
</RelativeLayout>
</RelativeLayout>
</android.support.v7.widget.Toolbar>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<FrameLayout
android:id="#+id/main_content"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#android:color/transparent" />
<com.bitage.carlo.fencity.ui.view.BottomMenuView
android:id="#+id/bottom_menu"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize" />
</LinearLayout>
</RelativeLayout>
and a fragment xml:
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 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"
android:layout_marginTop="?attr/actionBarSize"
android:orientation="vertical">
<android.support.design.widget.AppBarLayout
android:id="#+id/novita_app_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:id="#+id/novita_search_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/background"
app:layout_scrollFlags="scroll|enterAlways|snap">
<EditText
android:id="#+id/search_edit"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="#dimen/layout_padding"
android:background="#null"
android:hint="#string/search"
android:imeOptions="actionDone"
android:paddingEnd="#dimen/layout_padding"
android:paddingLeft="#dimen/padding_start"
android:paddingRight="#dimen/layout_padding"
android:paddingStart="#dimen/padding_start"
android:singleLine="true" />
<ImageView
android:id="#+id/search_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="#dimen/layout_padding"
android:layout_marginStart="#dimen/layout_padding"
android:src="#drawable/ic_search" />
</RelativeLayout>
</android.support.design.widget.AppBarLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<android.support.v7.widget.RecyclerView
android:id="#+id/places_recycler_view"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#android:color/transparent"
android:src="#drawable/nav_shadow" />
</RelativeLayout>
</android.support.design.widget.CoordinatorLayout>
Now, I need this to stay the same if possible, just somehow to add the scroll behavior app:layout_scrollFlags="scroll|enterAlways|snap" on toolbar only in this fragment, while search from the fragment still has the same behaviour.
How can I achieve this?
So, you can do next:
in your Fragment class, you have recyclerview. Now, what you want to do is put the recyclerView.addOnScrollListener(new YourScrollListenerClass(context, toolbar, coordinatorLayout));
Coordinator layout is the one of the fragment, please bear that in mind.
Now, create a new class YourScrollListenerClass:
public class YourScrollListenerClass extends RecyclerView.OnScrollListener {
private Context mContext;
private Toolbar mToolbar;
private CoordinatorLayout mCoordinatorLayout;
private int mToolbarHeight;
private int mCoordinatorLayoutTopMargin;
public YourScrollListenerClass(Context context, #Nullable Toolbar toolbar, #Nullable final CoordinatorLayout mCoordinatorLayout) {
this.mContext = context;
mToolbar = toolbar;
this.mCoordinatorLayout = mCoordinatorLayout;
if (mToolbar != null && mCoordinatorLayout != null) {
mToolbar.post(new Runnable() {
#Override
public void run() {
mToolbarHeight = mToolbar.getHeight();
}
});
mCoordinatorLayout.post(new Runnable() {
#Override
public void run() {
mCoordinatorLayoutTopMargin = ((FrameLayout.LayoutParams) mCoordinatorLayout.getLayoutParams()).topMargin;
}
});
}
}
#Override
public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
if (recyclerView != null) {
if (mToolbar != null) {
float offset = mToolbar.getTranslationY() - dy;
if (offset <= 0 && offset >= -(mToolbar.getHeight())) {
mToolbar.setTranslationY(mToolbar.getTranslationY() - dy);
FrameLayout.LayoutParams params1 = (FrameLayout.LayoutParams) mCoordinatorLayout.getLayoutParams();
params1.setMargins(0, params1.topMargin - dy, 0, 0);
mCoordinatorLayout.setLayoutParams(params1);
}
}
}
}
#Override
public void onScrollStateChanged(RecyclerView recyclerView, int newState) {
super.onScrollStateChanged(recyclerView, newState);
if (RecyclerView.SCROLL_STATE_IDLE == newState) {
if(mToolbar != null) {
if (Math.abs(mToolbar.getTranslationY()) <= mToolbar.getHeight() / 2) {
ObjectAnimator animator = ObjectAnimator.ofFloat(mToolbar, View.TRANSLATION_Y, mToolbar.getTranslationY(), 0);
animator.setDuration(300);
animator.start();
MarginAnimation animation = new MarginAnimation(mCoordinatorLayout, ((FrameLayout.LayoutParams) mCoordinatorLayout.getLayoutParams()).topMargin, mCoordinatorLayoutTopMargin);
mCoordinatorLayout.startAnimation(animation);
} else {
ObjectAnimator animator = ObjectAnimator.ofFloat(mToolbar, View.TRANSLATION_Y, mToolbar.getTranslationY(), -mToolbarHeight);
animator.setDuration(300);
animator.start();
MarginAnimation animation = new MarginAnimation(mCoordinatorLayout, ((FrameLayout.LayoutParams) mCoordinatorLayout.getLayoutParams()).topMargin, 0);
mCoordinatorLayout.startAnimation(animation);
}
}
}
}
}
And for the margin animation, create new Class
public class MarginAnimation extends Animation {
private View mView;
private float mToMargin;
private float mFromMargin;
private Context mContext;
public MarginAnimation(View v, float fromTop, float toTop) {
mFromMargin = fromTop;
mToMargin = toTop;
mView = v;
setDuration(300);
}
#Override
protected void applyTransformation(float interpolatedTime, Transformation t) {
float topMargin = (mToMargin - mFromMargin) * interpolatedTime + mFromMargin;
Log.d("TopMargin", String.valueOf(topMargin));
FrameLayout.LayoutParams p = (FrameLayout.LayoutParams) mView.getLayoutParams();
p.setMargins(0, (int) topMargin, 0, 0);
mView.setLayoutParams(p);
mView.requestLayout();
}
#Override
public void initialize(int width, int height, int parentWidth, int parentHeight) {
super.initialize(width, height, parentWidth, parentHeight);
}
#Override
public boolean willChangeBounds() {
return true;
}
}
Hope this helps...
I have a Gridview inside a fragment of a ViewPager. I have 2x2 grid that I want to center on the parent, the ViewPager. It's displaying like this, only centering horizontally but not vertically My xml files are as follow.
This is the activity_main_menu.xml
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/background"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_below="#+id/actionBar"
android:scaleType="centerCrop"
android:background="#drawable/home_01" />
<android.support.v4.view.ViewPager
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:layout_below="#+id/actionBar"
android:layout_above="#+id/buttonBar"
tools:context="com.excitingspace.areias_do_seixo.MainMenu" >
</android.support.v4.view.ViewPager>
<com.viewpagerindicator.CirclePageIndicator
android:id="#+id/titles"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="15dp"
android:layout_above="#+id/buttonBar"/>
</RelativeLayout>
And this is the fragment_main_menu.xml
<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"
tools:context="com.excitingspace.areias_do_seixo.MainMenu$PlaceholderFragment" >
<GridView
android:id="#+id/gridView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentTop="true"
android:columnWidth="150dp"
android:gravity="center"
android:listSelector="#android:color/transparent"
android:horizontalSpacing="10dp"
android:layout_centerInParent="true"
android:numColumns="2"
android:verticalSpacing="10dp" >
</GridView>
</RelativeLayout>
EDIT, adds the ImageAdapter used to populate the GridView:
public class ImageAdapter extends BaseAdapter {
private static int PADDING = 0;
private static int WIDTH = 0;
private static int HEIGHT = 0;
private Context mContext;
private List<Integer> mThumbIds;
private List<Integer> mThumbIds_highlighted;
public ImageAdapter(Context c, List<Integer> ids, List<Integer> ids_highlighted) {
mContext = c;
this.mThumbIds = ids;
this.mThumbIds_highlighted = ids_highlighted;
int baseWidth = 150;
int baseHeight = 150;
int basePading = 20;
float density = mContext.getResources().getDisplayMetrics().density;
if ((mContext.getResources().getConfiguration().screenLayout & Configuration.SCREENLAYOUT_SIZE_MASK) == Configuration.SCREENLAYOUT_SIZE_LARGE)
{
baseWidth = 200;
baseHeight = 200;
basePading = 20;
}
ImageAdapter.WIDTH = (int) (baseWidth * density + 0.5f);
ImageAdapter.HEIGHT = (int) (baseHeight * density + 0.5f);
ImageAdapter.PADDING = (int) (basePading * density + 0.5f);
}
#Override
public int getCount() {
return mThumbIds.size();
}
#Override
public Object getItem(int position) {
return null;
}
// Will get called to provide the ID that
// is passed to OnItemClickListener.onItemClick()
#Override
public long getItemId(int position) {
return mThumbIds.get(position);
}
// create a new ImageView for each item referenced by the Adapter
#SuppressWarnings("deprecation")
#Override
public View getView(final int position, View convertView, ViewGroup parent)
{
ImageView imageView = (ImageView) convertView;
StateListDrawable sld = new StateListDrawable();
Drawable draw1 = mContext.getResources().getDrawable(mThumbIds.get(position));
Drawable draw2 = mContext.getResources().getDrawable(mThumbIds_highlighted.get(position));
sld.addState(new int[] { android.R.attr.state_pressed }, draw2);
sld.addState(StateSet.WILD_CARD, draw1);
// if convertView's not recycled, initialize some attributes
if (imageView == null) {
imageView = new ImageView(mContext);
imageView.setLayoutParams(new GridView.LayoutParams(WIDTH, HEIGHT));
imageView.setPadding(PADDING, PADDING, PADDING, PADDING);
// imageView.setScaleX();
}
imageView.setBackgroundDrawable(sld);
return imageView;
}
}
modify your fragment_main_menu.xml file like this
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.excitingspace.areias_do_seixo.MainMenu$PlaceholderFragment" >
<GridView
android:id="#+id/gridView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:columnWidth="150dp"
android:gravity="center_vertical"
android:listSelector="#android:color/transparent"
android:horizontalSpacing="10dp"
android:layout_centerInParent="true"
android:numColumns="2"
android:verticalSpacing="10dp" >
</GridView>
</RelativeLayout>
I have a buttonView1 and a customView1 that only draws a small circle. in my main_layout only buttonView1 is visible.
How can I programmatically display customView1 in center of buttonView1 when button is clicked.
attention: we dont want to change button background. we want to show a new view (customView or any other view like editText) on another view (button) when button is pressed.
layout code:
<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:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context=".MainActivity" >
<Button
android:id="#+id/buttonView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="102dp"
android:layout_marginTop="86dp"
android:text="#string/button_text" />
</RelativeLayout>
activity code
///...
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mButton = (Button)findViewById(R.id.buttonView1);
mButton.setOnClickListener(this);
}
#Override
public void onClick(View v) {
switch (v.getId()) {
case R.id.buttonView1:
// do sth here
break;
default:
break;
}
}
///...
RelativeLayout.LayoutParams layoutParams =
(RelativeLayout.LayoutParams)positiveButton.getLayoutParams();
layoutParams.addRule(RelativeLayout.CENTER_IN_PARENT, RelativeLayout.TRUE);
yourView.setLayoutParams(layoutParams);
public void MoveView() {
float a = parent_view.getWidth() / 2;
final ValueAnimator positionAnimator =
ValueAnimator.ofFloat(current_view.getX(), a);
positionAnimator.setInterpolator(new AccelerateDecelerateInterpolator());
positionAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
#Override
public void onAnimationUpdate(ValueAnimator animation) {
float x = (Float) positionAnimator.getAnimatedValue();
current_view.setX(x);
}
});
positionAnimator.setDuration(100);
positionAnimator.start();
}
parent_view is the view in whose center you would like to place your current_view.
Hope that Helps.
I am trying to do flip card animation for my splash screen. I have split my screen into 3 parts vertically and I am trying to flip them as Front - Back (Pause for a second) - Front
I found a wonderful question here which helped me figure out the Front - Back part but no matter what I do I am not able to flip them back. I am new to animations, so please help me out! Thanks!
FlipAnimation.java
public class FlipAnimation extends Animation {
private Camera camera;
private View fromView;
private View toView;
private float centerX;
private float centerY;
private boolean forward = true;
/**
* Creates a 3D flip animation between two views.
*
* #param fromView
* First view in the transition.
* #param toView
* Second view in the transition.
*/
public FlipAnimation(View fromView, View toView) {
this.fromView = fromView;
this.toView = toView;
setDuration(1500);
setFillAfter(false);
setInterpolator(new AccelerateDecelerateInterpolator());
}
public void reverse() {
forward = false;
View switchView = toView;
toView = fromView;
fromView = switchView;
}
#Override
public void initialize(int width, int height, int parentWidth,
int parentHeight) {
super.initialize(width, height, parentWidth, parentHeight);
centerX = width / 2;
centerY = height / 2;
camera = new Camera();
}
#Override
protected void applyTransformation(float interpolatedTime, Transformation t) {
// Angle around the y-axis of the rotation at the given time
// calculated both in radians and degrees.
final double radians = Math.PI * interpolatedTime;
float degrees = (float) (180.0 * radians / Math.PI);
// Once we reach the midpoint in the animation, we need to hide the
// source view and show the destination view. We also need to change
// the angle by 180 degrees so that the destination does not come in
// flipped around
if (interpolatedTime >= 0.5f) {
degrees -= 180.f;
fromView.setVisibility(View.GONE);
toView.setVisibility(View.VISIBLE);
}
if (forward)
degrees = -degrees; // determines direction of rotation when flip
// begins
final Matrix matrix = t.getMatrix();
camera.save();
camera.translate(0, 0, Math.abs(degrees) * 2);
camera.getMatrix(matrix);
camera.rotateY(degrees);
camera.getMatrix(matrix);
camera.restore();
matrix.preTranslate(-centerX, -centerY);
matrix.postTranslate(centerX, centerY);
}
}
SplashActivity.java
public class SplashActivity extends Activity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.splash);
flipCard1();
flipCard2();
flipCard3();
flipBack1();
flipBack2();
flipBack3();
}
private void flipCard1() {
Log.i("Debug_Tag", "Inside flipCard1");
View rootLayout = (View) findViewById(R.id.main_activity_root1);
View cardFace1 = (View) findViewById(R.id.main_activity_card_face1);
View cardBack1 = (View) findViewById(R.id.main_activity_card_back1);
FlipAnimation flipAnimation1 = new FlipAnimation(cardFace1, cardBack1);
if (cardFace1.getVisibility() == View.GONE) {
flipAnimation1.reverse();
}
rootLayout.startAnimation(flipAnimation1);
}
private void flipCard2() {
View rootLayout = (View) findViewById(R.id.main_activity_root2);
View cardFace2 = (View) findViewById(R.id.main_activity_card_face2);
View cardBack2 = (View) findViewById(R.id.main_activity_card_back2);
FlipAnimation flipAnimation2 = new FlipAnimation(cardFace2, cardBack2);
if (cardFace2.getVisibility() == View.GONE) {
flipAnimation2.reverse();
}
rootLayout.startAnimation(flipAnimation2);
}
private void flipCard3() {
View rootLayout = (View) findViewById(R.id.main_activity_root3);
View cardFace3 = (View) findViewById(R.id.main_activity_card_face3);
View cardBack3 = (View) findViewById(R.id.main_activity_card_back3);
FlipAnimation flipAnimation3 = new FlipAnimation(cardFace3, cardBack3);
if (cardFace3.getVisibility() == View.GONE) {
flipAnimation3.reverse();
}
rootLayout.startAnimation(flipAnimation3);
}
private void flipBack1() {
View rootLayout = (View) findViewById(R.id.main_activity_root1);
View cardFace1 = (View) findViewById(R.id.main_activity_card_face1);
View cardBack1 = (View) findViewById(R.id.main_activity_card_back1);
FlipAnimation flipBackAnimation11 = new FlipAnimation(cardBack1,
cardFace1);
if (cardBack1.getVisibility() == View.GONE) {
flipBackAnimation11.reverse();
}
rootLayout.startAnimation(flipBackAnimation11);
}
private void flipBack2() {
View rootLayout = (View) findViewById(R.id.main_activity_root1);
View cardFace2 = (View) findViewById(R.id.main_activity_card_face2);
View cardBack2 = (View) findViewById(R.id.main_activity_card_back2);
FlipAnimation flipBackAnimation22 = new FlipAnimation(cardBack2,
cardFace2);
if (cardBack2.getVisibility() == View.GONE) {
flipBackAnimation22.reverse();
}
rootLayout.startAnimation(flipBackAnimation22);
}
private void flipBack3() {
View rootLayout = (View) findViewById(R.id.main_activity_root1);
View cardFace3 = (View) findViewById(R.id.main_activity_card_face3);
View cardBack3 = (View) findViewById(R.id.main_activity_card_back3);
FlipAnimation flipBackAnimation33 = new FlipAnimation(cardBack3,
cardFace3);
if (cardBack3.getVisibility() == View.GONE) {
flipBackAnimation33.reverse();
}
rootLayout.startAnimation(flipBackAnimation33);
}
}
splash.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/main_activity_rootMain"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#android:color/transparent" >
<RelativeLayout
android:id="#+id/main_activity_root1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#android:color/transparent" >
<RelativeLayout
android:id="#+id/main_activity_card_face1"
android:layout_width="100dp"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:background="#drawable/front"
android:clickable="true"
android:onClick="onCardClick"
android:padding="5dp" >
</RelativeLayout>
<RelativeLayout
android:id="#+id/main_activity_card_back1"
android:layout_width="100dp"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:background="#drawable/back"
android:clickable="true"
android:onClick="onCardClick"
android:visibility="gone" >
</RelativeLayout>
</RelativeLayout>
<RelativeLayout
android:id="#+id/main_activity_root2"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#android:color/transparent" >
<RelativeLayout
android:id="#+id/main_activity_card_face2"
android:layout_width="100dp"
android:layout_height="match_parent"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:background="#drawable/front"
android:clickable="true"
android:onClick="onCardClick"
android:padding="5dp" >
</RelativeLayout>
<RelativeLayout
android:id="#+id/main_activity_card_back2"
android:layout_width="100dp"
android:layout_height="match_parent"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:background="#drawable/back"
android:clickable="true"
android:onClick="onCardClick"
android:visibility="gone" >
</RelativeLayout>
</RelativeLayout>
<RelativeLayout
android:id="#+id/main_activity_root3"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#android:color/transparent" >
<RelativeLayout
android:id="#+id/main_activity_card_face3"
android:layout_width="100dp"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:background="#drawable/front"
android:clickable="true"
android:onClick="onCardClick"
android:padding="5dp" >
</RelativeLayout>
<RelativeLayout
android:id="#+id/main_activity_card_back3"
android:layout_width="100dp"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:background="#drawable/back"
android:clickable="true"
android:onClick="onCardClick"
android:visibility="gone" >
</RelativeLayout>
</RelativeLayout>
</RelativeLayout>
To achieve flip card animation in platforms below 3.0, you can do it as follows:
Add two drawables in the drawable folder
front.png
back.png
The activity (SplashActivity.java)
public class SplashActivity extends Activity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.splash);
flipCard(R.id.main_activity_root1, R.id.main_activity_card_face1,
R.id.main_activity_card_back1);
flipCard(R.id.main_activity_root2, R.id.main_activity_card_face2,
R.id.main_activity_card_back2);
flipCard(R.id.main_activity_root3, R.id.main_activity_card_face3,
R.id.main_activity_card_back3);
}
private void flipCard(int idRootLayout, int idCardFace, int idCardBack) {
final View rootLayout = (View) findViewById(idRootLayout);
final View cardFace = (View) findViewById(idCardFace);
final View cardBack = (View) findViewById(idCardBack);
FlipAnimation flipAnimation1 = new FlipAnimation(cardFace, cardBack);
AnimationListener flipAnimation1Listener = new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationRepeat(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
cardBack.setVisibility(View.VISIBLE);
cardFace.setVisibility(View.VISIBLE);
FlipAnimation f = new FlipAnimation(cardFace, cardBack);
f.reverse();
rootLayout.startAnimation(f);
}
};
flipAnimation1.setAnimationListener(flipAnimation1Listener);
rootLayout.startAnimation(flipAnimation1);
}
}
The Animation (FlipAnimation.java)
import android.graphics.Camera;
import android.graphics.Matrix;
import android.view.View;
import android.view.animation.AccelerateDecelerateInterpolator;
import android.view.animation.Animation;
import android.view.animation.Transformation;
public class FlipAnimation extends Animation {
private Camera camera;
private View fromView;
private View toView;
private float centerX;
private float centerY;
private boolean forward = true;
public FlipAnimation(View fromView, View toView) {
this.fromView = fromView;
this.toView = toView;
setDuration(1500);
setFillAfter(false);
setInterpolator(new AccelerateDecelerateInterpolator());
}
public void reverse() {
forward = false;
View switchView = toView;
toView = fromView;
fromView = switchView;
}
#Override
public void initialize(int width, int height, int parentWidth,
int parentHeight) {
super.initialize(width, height, parentWidth, parentHeight);
centerX = width / 2;
centerY = height / 2;
camera = new Camera();
}
#Override
protected void applyTransformation(float interpolatedTime, Transformation t) {
final double radians = Math.PI * interpolatedTime;
float degrees = (float) (180.0 * radians / Math.PI);
if (interpolatedTime >= 0.5f) {
degrees -= 180.f;
fromView.setVisibility(View.GONE);
toView.setVisibility(View.VISIBLE);
}
if (forward)
degrees = -degrees;
final Matrix matrix = t.getMatrix();
camera.save();
camera.translate(0, 0, Math.abs(degrees) * 2);
camera.getMatrix(matrix);
camera.rotateY(degrees);
camera.getMatrix(matrix);
camera.restore();
matrix.preTranslate(-centerX, -centerY);
matrix.postTranslate(centerX, centerY);
}
}
The XML layout (splash.xml)
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/main_activity_rootMain"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#android:color/transparent" >
<RelativeLayout
android:id="#+id/main_activity_root1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#android:color/transparent" >
<RelativeLayout
android:id="#+id/main_activity_card_face1"
android:layout_width="100dp"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:background="#drawable/front"
android:clickable="true"
android:onClick="onCardClick"
android:padding="5dp" >
</RelativeLayout>
<RelativeLayout
android:id="#+id/main_activity_card_back1"
android:layout_width="100dp"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:background="#drawable/back"
android:clickable="true"
android:onClick="onCardClick"
android:visibility="gone" >
</RelativeLayout>
</RelativeLayout>
<RelativeLayout
android:id="#+id/main_activity_root2"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#android:color/transparent" >
<RelativeLayout
android:id="#+id/main_activity_card_face2"
android:layout_width="100dp"
android:layout_height="match_parent"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:background="#drawable/front"
android:clickable="true"
android:onClick="onCardClick"
android:padding="5dp" >
</RelativeLayout>
<RelativeLayout
android:id="#+id/main_activity_card_back2"
android:layout_width="100dp"
android:layout_height="match_parent"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:background="#drawable/back"
android:clickable="true"
android:onClick="onCardClick"
android:visibility="gone" >
</RelativeLayout>
</RelativeLayout>
<RelativeLayout
android:id="#+id/main_activity_root3"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#android:color/transparent" >
<RelativeLayout
android:id="#+id/main_activity_card_face3"
android:layout_width="100dp"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:background="#drawable/front"
android:clickable="true"
android:onClick="onCardClick"
android:padding="5dp" >
</RelativeLayout>
<RelativeLayout
android:id="#+id/main_activity_card_back3"
android:layout_width="100dp"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:background="#drawable/back"
android:clickable="true"
android:onClick="onCardClick"
android:visibility="gone" >
</RelativeLayout>
</RelativeLayout>
</RelativeLayout>
Attribution: The XML and the Animation java file are from the question
I think better to use animation using xml . You need to create a new folder in 'res' named 'anim'
then create an xml file named flip.xml and add following code
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true"
android:interpolator="#android:anim/accelerate_interpolator" >
<!-- Shrinks the image from the left towards the right. -->
<scale
android:duration="200"
android:fromXScale="0"
android:fromYScale="1.0"
android:pivotX="50%"
android:pivotY="50%"
android:toXScale="1.0"
android:toYScale="1.0" />
</set>
this will create a flip animation, you can also modify it according to your requirements.To use it you have to do
Animation animation = AnimationUtils.loadAnimation(mContext, R.anim.flip);
ImageView imageView;
imageView.startAnimation(animation) ;
you can use any type of view to apply this animation.
Hope this will help.
I have an Activity with some elements like ImageView, Button, ToggleButton, ... . And a subview (LinearLayout) that contains an HorizontalScrollView of ImageView.
The subview is an element that I want to hide / show with an animation.
My animation works successfully. But when I touch a ToggleButton or I apply a Filter, the subview is reseted and back to its origin position.
I have deduce that the subview is replaced in its origin when an element of the view visually change.
But I don't understand why...
The Activity class
public class CameraActivity extends Activity implements PictureCallback
{
private ToggleButton flashButton;
private Button filterScrollButton;
private LinearLayout filterScrollView;
private LinearLayout filterScrollViewLayout;
private Boolean filtersIsOpened = false;
private ImageView filterImageView;
#Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_camera);
// Show the Up button in the action bar.
getActionBar().setDisplayHomeAsUpEnabled(true);
flashButton = (ToggleButton)findViewById(R.id.button_flash);
filterScrollButton = (Button)findViewById(R.id.button_open_filters);
filterScrollView = (LinearLayout)findViewById(R.id.camera_scroll_filters);
filterScrollViewLayout = (LinearLayout)findViewById(R.id.camera_scroll_filters_layout);
}
...
private void initScrollFilters()
{
String[] filters = getResources().getStringArray(R.array.array_filters);
for (final String string : filters)
{
ImageView v = new ImageView(CameraActivity.this);
int imageFilterId = -1;
if (string != null && !string.isEmpty())
{
final int imageId = getResources().getIdentifier("#drawable/filter_" + string, null, getPackageName());
imageFilterId = getResources().getIdentifier("#drawable/filter_" + string, null, getPackageName());
v.setImageDrawable(getResources().getDrawable(imageId));
}
final int finalImageFilterId = imageFilterId;
v.setOnClickListener(new OnClickListener()
{
#Override
public void onClick(View view) {
Log.d(string + " filter image is touched");
CameraActivity.this.cameraManager.setImageFilter(finalImageFilterId); // Apply the new filter into filterImageView
}
});
filterScrollViewLayout.addView(v, 100, 100);
}
}
private void initListeners()
{
// Flash
flashButton.setOnCheckedChangeListener(new OnCheckedChangeListener()
{
#Override
public void onCheckedChanged(CompoundButton buttonView, boolean isChecked)
{
// camera parameters is changed
}
});
// Filter scroll view
filterScrollButton.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v)
{
Log.d("You click the filter scroll button men!!");
final float direction = (CameraActivity.this.filtersIsOpened) ? -1 : 1;
final float yDelta = -100;
final Animation animation = new TranslateAnimation(0, 0, 0, yDelta * direction);
animation.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {}
#Override
public void onAnimationRepeat(Animation animation) {}
#Override
public void onAnimationEnd(Animation animation)
{
TranslateAnimation anim = new TranslateAnimation(0.0f, 0.0f, 0.0f, 0.0f);
anim.setDuration(1);
CameraActivity.this.filterScrollView.startAnimation(anim);
int top = (int) (CameraActivity.this.filterScrollView.getTop() + (yDelta * direction));
CameraActivity.this.filterScrollView.setTop(top);
}
});
animation.setDuration(500);
CameraActivity.this.filterScrollView.startAnimation(animation);
CameraActivity.this.filtersIsOpened = ! CameraActivity.this.filtersIsOpened;
}
});
}
...
}
The xml view
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".CameraActivity" >
<CameraPreview
android:id="#+id/camera_preview"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<ImageView
android:id="#+id/camera_preview_filter"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:rotation="90"
android:scaleType="center"
android:contentDescription="#string/content_desc_overlay" />
<LinearLayout
android:id="#+id/camera_scroll_filters"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_marginBottom="-40dp"
android:paddingTop="40dp"
android:orientation="vertical"
android:clickable="false"
android:longClickable="false" >
<Button
android:id="#+id/button_open_filters"
android:layout_width="wrap_content"
android:layout_height="25dp"
android:layout_gravity="top|center_horizontal"
android:text="Filters" >
</Button>
<HorizontalScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#FF00FF00"
android:scrollbars="none" >
<LinearLayout
android:id="#+id/camera_scroll_filters_layout"
android:layout_width="wrap_content"
android:layout_height="100dp"
android:layout_gravity="bottom"
android:orientation="horizontal" >
</LinearLayout>
</HorizontalScrollView>
</LinearLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="60dp"
android:layout_gravity="bottom"
android:background="#FF000000" >
</FrameLayout>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center_horizontal"
android:onClick="onCaptureClick"
android:text="#string/button_capture_text" />
</FrameLayout>