Disposition Animation Android [Facebook]

OK Après avoir passé 2 jours à lire sur les problèmes de Similair et comment les gens les ont résolus, j'ai enfin pu créer la chose que je voulais. Je n'ai pas pu le faire avec deux fichiers XML différents, mais je doute que ce ne soit pas possible.

J'ai rencontré des problèmes que ceux-ci. P>

Après la fin de la première animation terminée, le bouton n'a pas été cliquable. En effet, l'animation montre que tout est déplacé mais qu'il ne met pas à jour la mise en page, le bouton est donc toujours à la position où l'animation a commencé. Je devais donc calculer la nouvelle position de la mise en page. P>

Je pense avoir lu quelque part que ce n'est plus un problème dans 3.0, mais corrige-moi si je me trompe p>

un autre était que quand j'avais mon animation enfin de la façon dont je voulais finalement la façon dont je voulais Ma vue de sous-couche n'a pas disparu avant que l'animation ait été terminée parce que j'ai appelé vue.setVisabilty (vue.gone); code>. Maintenant, le problème était que lorsque je n'avais pas invoqué cette méthode, l'animation est juste suspendue pendant une seconde, puis le tireur à la position finale de l'animation. J'ai donc ajouté un linearlayout vide (peut être n'importe quoi), une propriété par défaut allée, lorsque l'animation commence à la définir sur Visible. Lorsque vous retournez l'animation, réglez-le à nouveau. Après cela, l'animation fonctionnait comme je le voulais. p>

et si vous utilisez un reliel, linéaire ou toute autre mise en page. Ensuite, vous ne pouvez pas empiler des vues dans l'ordre Z afin que vous ayez à utiliser une vue superficielle. P>

SO HERES MAIN.XML P>

    public class MenuAnimationActivity extends Activity {

    private Button buttonSwitch;  
    private View subLayout;
    private View topLayout;
    private ListView subViewListView;
    private String listViewDummyContent[]={"Android","iPhone","BlackBerry","AndroidPeople"};
    private Display display;
    private View fakeLayout;
    private AnimationListener AL;

    // Values for after the animation
    private int oldLeft;
    private int oldTop;
    private int newleft;
    private int newTop;
    private int screenWidth;    
    private int animToPostion; 
    // TODO change the name of the animToPostion for a better explanation.

    private boolean menuOpen = false;

        /** Called when the activity is first created. */  
        @Override  
        public void onCreate(Bundle savedInstanceState) {  
            super.onCreate(savedInstanceState);  
            setContentView(R.layout.main);  

            buttonSwitch = (Button)findViewById(R.id.button);  
            subLayout = (View) findViewById(R.id.layout);  
            topLayout = (View) findViewById(R.id.layoutTwo);
            subViewListView=(ListView)findViewById(R.id.listView1);
            fakeLayout = (View)findViewById(R.id.fake_layouy);

            subViewListView.setAdapter(new ArrayAdapter<String>(this,android.R.layout.simple_list_item_1 , listViewDummyContent));

            display =  getWindowManager().getDefaultDisplay();
            screenWidth = display.getWidth();
            int calcAnimationPosition = (screenWidth /3);

            // Value where the onTop Layer has to animate
            // also the max width of the layout underneath 
            // Set Layout params for subLayout according to calculation
            animToPostion = screenWidth - calcAnimationPosition;

            RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(animToPostion, RelativeLayout.LayoutParams.FILL_PARENT);
            subLayout.setLayoutParams(params);

             topLayout.setOnTouchListener(new OnTouchListener() {

                @Override
                public boolean onTouch(View v, MotionEvent event) {

                        if(event.getAction() == MotionEvent.ACTION_DOWN) {
                            if (menuOpen == true) {
                                animSlideLeft();
                            }
                        }

                    return false;
                }
            });

            buttonSwitch.setOnClickListener(new View.OnClickListener() {  

               @Override  
               public void onClick(View v) { 
                   if(menuOpen == false){    
                       animSlideRight();
                   } else if (menuOpen == true) {
                       animSlideLeft();
                       }
                   }  
                  });  

             AL = new AnimationListener() {

                @Override
                public void onAnimationStart(Animation animation) {
                    buttonSwitch.setClickable(false);
                    topLayout.setEnabled(false);
                }           
                @Override
                public void onAnimationRepeat(Animation animation) {
                    // TODO Auto-generated method stub

                }               
                @Override
                public void onAnimationEnd(Animation animation) {
                    if(menuOpen == true) {
                        Log.d("", "Open");              
                        topLayout.layout(oldLeft, oldTop, oldLeft + topLayout.getMeasuredWidth(), oldTop + topLayout.getMeasuredHeight() );
                        menuOpen = false;
                        buttonSwitch.setClickable(true);
                        topLayout.setEnabled(true);
                    } else if(menuOpen == false) {
                        Log.d("","FALSE");
                        topLayout.layout(newleft, newTop, newleft + topLayout.getMeasuredWidth(), newTop + topLayout.getMeasuredHeight() );                    
                        topLayout.setEnabled(true);
                        menuOpen = true;
                        buttonSwitch.setClickable(true);
                    }
                }
            };
        } 

        public void animSlideRight(){

                    fakeLayout.setVisibility(View.VISIBLE);
                newleft = topLayout.getLeft() + animToPostion;
                newTop = topLayout.getTop();    
                TranslateAnimation slideRight = new TranslateAnimation(0,newleft,0,0);
                slideRight.setDuration(500);   
                slideRight.setFillEnabled(true);   
                slideRight.setAnimationListener(AL);    
                topLayout.startAnimation(slideRight);           
        }

        public void animSlideLeft() {

            fakeLayout.setVisibility(View.GONE);
            oldLeft = topLayout.getLeft() - animToPostion;
            oldTop = topLayout.getTop();        
            TranslateAnimation slideLeft = new TranslateAnimation(newleft,oldLeft,0,0);
            slideLeft.setDuration(500);   
            slideLeft.setFillEnabled(true);   
            slideLeft.setAnimationListener(AL);    
            topLayout.startAnimation(slideLeft);                
        }
}  

J'ai eu l'exigence similaire qui fait une animation de mise en page comme l'application Facebook. Pour ce faire, j'ai fait un groupe de visiteux personnalisé (appelé AnimationLayout). J'espère que ce code aidant.

L'animationLayout a besoin de deux enfants: barre latérale et contenu. (En attribuant @ + id / animation_side_sidebar et @ + id / animation_content à l'une) p>

Il s'agit de la mise en page XML, la barre latérale a un bouton et une liste de réception. Le contenu a une vue texte et un bouton (il se lie à une fonction de rappel). P>

/*
 * Copyright (C) 2012 0xlab - http://0xlab.org/
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 *
 * Authored by Julian Chu <walkingice AT 0xlab.org>
 */

package org.zeroxlab.widget;

import test.julian.hello.R;

import android.content.Context;
import android.util.AttributeSet;
import android.view.animation.Animation;
import android.view.animation.TranslateAnimation;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.MeasureSpec;
import android.view.ViewGroup;
import android.view.ViewGroup.LayoutParams;

public class AnimationLayout extends ViewGroup {

    public final static int DURATION = 500;

    protected boolean mOpened;
    protected View mSidebar;
    protected View mContent;
    protected int mSidebarWidth = 150; // by default

    protected Animation mAnimation;
    protected OpenListener    mOpenListener;
    protected CloseListener   mCloseListener;
    protected Listener mListener;

    protected boolean mPressed = false;

    public AnimationLayout(Context context) {
        this(context, null);
    }

    public AnimationLayout(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    @Override
    public void onFinishInflate() {
        super.onFinishInflate();
        mSidebar = findViewById(R.id.animation_sidebar);
        mContent = findViewById(R.id.animation_content);

        if (mSidebar == null) {
            throw new NullPointerException("no view id = animation_sidebar");
        }

        if (mContent == null) {
            throw new NullPointerException("no view id = animation_content");
        }

        mOpenListener = new OpenListener(mSidebar, mContent);
        mCloseListener = new CloseListener(mSidebar, mContent);
    }

    @Override
    public void onLayout(boolean changed, int l, int t, int r, int b) {
        /* the title bar assign top padding, drop it */
        mSidebar.layout(l, 0, l + mSidebarWidth, 0 + mSidebar.getMeasuredHeight());
        if (mOpened) {
            mContent.layout(l + mSidebarWidth, 0, r + mSidebarWidth, b);
        } else {
            mContent.layout(l, 0, r, b);
        }
    }

    @Override
    public void onMeasure(int w, int h) {
        super.onMeasure(w, h);
        super.measureChildren(w, h);
        mSidebarWidth = mSidebar.getMeasuredWidth();
    }

    @Override
    protected void measureChild(View child, int parentWSpec, int parentHSpec) {
        /* the max width of Sidebar is 90% of Parent */
        if (child == mSidebar) {
            int mode = MeasureSpec.getMode(parentWSpec);
            int width = (int)(getMeasuredWidth() * 0.9);
            super.measureChild(child, MeasureSpec.makeMeasureSpec(width, mode), parentHSpec);
        } else {
            super.measureChild(child, parentWSpec, parentHSpec);
        }
    }

    @Override
    public boolean onInterceptTouchEvent(MotionEvent ev) {
        if (!isOpening()) {
            return false;
        }

        int action = ev.getAction();

        if (action != MotionEvent.ACTION_UP
                && action != MotionEvent.ACTION_DOWN) {
            return false;
        }

        /* if user press and release both on Content while
         * sidebar is opening, call listener. otherwise, pass
         * the event to child. */
        int x = (int)ev.getX();
        int y = (int)ev.getY();
        if (mContent.getLeft() < x
                && mContent.getRight() > x
                && mContent.getTop() < y
                && mContent.getBottom() > y) {
            if (action == MotionEvent.ACTION_DOWN) {
                mPressed = true;
            }

            if (mPressed
                    && action == MotionEvent.ACTION_UP
                    && mListener != null) {
                mPressed = false;
                return mListener.onContentTouchedWhenOpening();
            }
        } else {
            mPressed = false;
        }

        return false;
    }

    public void setListener(Listener l) {
        mListener = l;
    }

    /* to see if the Sidebar is visible */
    public boolean isOpening() {
        return mOpened;
    }

    public void toggleSidebar() {
        if (mContent.getAnimation() != null) {
            return;
        }

        if (mOpened) {
            /* opened, make close animation*/
            mAnimation = new TranslateAnimation(0, -mSidebarWidth, 0, 0);
            mAnimation.setAnimationListener(mCloseListener);
        } else {
            /* not opened, make open animation */
            mAnimation = new TranslateAnimation(0, mSidebarWidth, 0, 0);
            mAnimation.setAnimationListener(mOpenListener);
        }
        mAnimation.setDuration(DURATION);
        mAnimation.setFillAfter(true);
        mAnimation.setFillEnabled(true);
        mContent.startAnimation(mAnimation);
    }

    public void openSidebar() {
        if (!mOpened) {
            toggleSidebar();
        }
    }

    public void closeSidebar() {
        if (mOpened) {
            toggleSidebar();
        }
    }

    class OpenListener implements Animation.AnimationListener {
        View iSidebar;
        View iContent;

        OpenListener(View sidebar, View content) {
            iSidebar = sidebar;
            iContent = content;
        }

        public void onAnimationRepeat(Animation animation) {
        }

        public void onAnimationStart(Animation animation) {
            iSidebar.setVisibility(View.VISIBLE);
        }

        public void onAnimationEnd(Animation animation) {
            iContent.clearAnimation();
            mOpened = !mOpened;
            requestLayout();
            if (mListener != null) {
                mListener.onSidebarOpened();
            }
        }
    }

    class CloseListener implements Animation.AnimationListener {
        View iSidebar;
        View iContent;

        CloseListener(View sidebar, View content) {
            iSidebar = sidebar;
            iContent = content;
        }

        public void onAnimationRepeat(Animation animation) {
        }
        public void onAnimationStart(Animation animation) {
        }

        public void onAnimationEnd(Animation animation) {
            iContent.clearAnimation();
            iSidebar.setVisibility(View.INVISIBLE);
            mOpened = !mOpened;
            requestLayout();
            if (mListener != null) {
                mListener.onSidebarClosed();
            }
        }
    }

    public interface Listener {
        public void onSidebarOpened();
        public void onSidebarClosed();
        public boolean onContentTouchedWhenOpening();
    }
}

J'ai pris la solution de Walkingice ( https://github.com/walkingice/gui-sliding -Sidebar ) et ajouté à celui-ci, faisant un widget dans lequel la "barre latérale" peut venir du haut ou du bas ainsi que de la gauche ou de la droite. Vous pouvez également spécifier la largeur de la barre latérale (ou la hauteur) en pourcentage de la largeur mère (ou de la hauteur). La barre latérale peut être stationnaire derrière la vue principale du contenu ou glisser dans.

Le projet est par solutiontream, et il est disponible ici: https://github.com/solutionstream/idebarlayout

C'est une source ouverte (licence Apache 2.0), alors n'hésitez pas à consulter le code et à l'utiliser (sous la licence), soit à titre d'exemple ou directement.

Divulgation: Le lien ci-dessus consiste à un projet que j'ai créé à Solutionstream.