тремтіння / хитання перегляду анімації в android


84

Я створив файл anim.xml, як показано нижче, щоб струсити перегляд зображень, як піктограма IOS, що трясеться в android. Однак це не дає мені такого ж результату. Чи є якась краща ідея?

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="300"

    android:fromDegrees="-2"
    android:pivotX="50%"
    android:pivotY="50%"
    android:repeatCount="infinite"
    android:toDegrees="2" />

Відповіді:


172

Спробуйте встановити android:repeatMode="reverse". Внизу анімація дає дуже розумну імітацію на моєму Galaxy Nexus. Очевидно, ви можете точно налаштувати параметри на свій смак.

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="100"
    android:fromDegrees="-5"
    android:pivotX="50%"
    android:pivotY="50%"
    android:repeatCount="infinite"
    android:repeatMode="reverse"
    android:toDegrees="5" />

я новачок у розробці android, я використовую Xamarin, скажіть, будь ласка, як застосувати цю анімацію до зображення / кнопки на будь-якій події, як клацання тощо
NK

@NK: Він повинен працювати так само, як і в Java: завантажте анімацію за її ідентифікатором ресурсу та скажіть своєму виду, щоб запустити анімацію, передавши її як параметр. Має виглядати приблизно так: view.StartAnimation(AnimationUtils.LoadAnimation(Resource.Animation.wobble)). Детальніше тут і тут .
МЗ.

3
Як можна додати затримку між струшуванням. наприклад показати струс протягом 500 мс, потім затримку на 1000 мс, а потім повторити ще раз?
Дамір Майлібаєв

76

Приємна анімація тряски ;

res / anim / shake.xml

<set xmlns:android="http://schemas.android.com/apk/res/android">

    <translate android:duration="150"
        android:fromXDelta="-10%"
        android:repeatCount="5"
        android:repeatMode="reverse"
        android:toXDelta="10%"/>
</set>

Як ним користуватися

final Animation animShake = AnimationUtils.loadAnimation(this, R.anim.shake);
btn_done = (Button) findViewById(R.id.btn_act_confirm_done); 
btn_done.startAnimation(animShake);

Як користуватися ним (простіша версія):

btn_done.startAnimation(AnimationUtils.loadAnimation(this,R.anim.shake));

3
android:duration="50"на мою думку, виглядає набагато менш поважно, а виглядає набагато краще
Алі Бдейр

45

Ви можете спробувати це:

shake.xml

<translate xmlns:android="http://schemas.android.com/apk/res/android" 
           android:fromXDelta="0" 
           android:toXDelta="10" 
           android:duration="1000" 
           android:interpolator="@anim/cycle_7" />

cycle_7.xml

<cycleInterpolator xmlns:android="http://schemas.android.com/apk/res/android" 
                   android:cycles="7" />

10
привіт, гадаю, cycle_7.xmlможна замінити android:repeatCount="7"атрибутом у<translate .../>
Ануп

28

спробуйте використати цей:

<set xmlns:android="http://schemas.android.com/apk/res/android">
    <rotate
        android:duration="70"
        android:fromDegrees="-5"
        android:pivotX="50%"
        android:pivotY="50%"
        android:repeatCount="5"
        android:repeatMode="reverse"
        android:interpolator="@android:anim/linear_interpolator"
        android:toDegrees="5" />
    <translate
        android:fromXDelta="-10"
        android:toXDelta="10"
        android:repeatCount="5"
        android:repeatMode="reverse"
        android:interpolator="@android:anim/linear_interpolator"
        android:duration="70" />
</set>

19

Щоб зробити такий ефект струсу

введіть тут опис зображення

Спочатку визначте анімацію тряски всередині папки anim як shake.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <rotate
        android:duration="70"
        android:fromDegrees="-5"
        android:interpolator="@android:anim/linear_interpolator"
        android:pivotX="50%"
        android:pivotY="50%"
        android:repeatCount="5"
        android:repeatMode="reverse"
        android:toDegrees="5" />
    <translate
        android:duration="70"
        android:fromXDelta="-10"
        android:interpolator="@android:anim/linear_interpolator"
        android:repeatCount="5"
        android:repeatMode="reverse"
        android:toXDelta="10" />
</set>

Потім у коді

if (TextUtils.isEmpty(phone.getText())
 || phone.getText().length() < 10)
    {
     //shake animation
    phone.startAnimation(AnimationUtils.loadAnimation(getActivity(), R.anim.shake));
     }

14

Я створив ефект тремтіння на Android і розмістив у GitHub. Подивіться, чи це працює краще.

https://github.com/teoinke/ShakeAnimation

Відповідний код:

<?xml version="1.0" encoding="utf-8"?>
<set
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/overshoot_interpolator"
    android:fillAfter="true">

    <translate
        android:startOffset="100"
        android:fromXDelta="0%p"
        android:toXDelta="10%p"
        android:duration="50" />

    <translate
        android:startOffset="150"
        android:fromXDelta="0%p"
        android:toXDelta="-25%p"
        android:duration="110" />


    <translate
        android:startOffset="260"
        android:fromXDelta="0%p"
        android:toXDelta="25%p"
        android:duration="120" />


    <translate
        android:startOffset="380"
        android:fromXDelta="0%p"
        android:toXDelta="-20%p"
        android:duration="130" />


    <translate
        android:startOffset="510"
        android:fromXDelta="0%p"
        android:toXDelta="10%p"
        android:duration="140" />

</set>

1
Для мене це найкраща відповідь, оскільки вона анімується від центру і не відразу компенсує зображення, як деякі інші пропозиції. Про!
Джонатан Данн,

13

Це працює досить добре (хоча і не ідеально) як клон струшування iOS "неправильного PIN-коду":

    final float FREQ = 3f;
    final float DECAY = 2f;
    // interpolator that goes 1 -> -1 -> 1 -> -1 in a sine wave pattern.
    TimeInterpolator decayingSineWave = new TimeInterpolator() {
                @Override
                public float getInterpolation(float input) {
                    double raw = Math.sin(FREQ * input * 2 * Math.PI);
                    return (float)(raw * Math.exp(-input * DECAY));
                }
            };

    shakeField.animate()
            .xBy(-100)
            .setInterpolator(decayingSineWave)
            .setDuration(500)
            .start();

6
/**
 *
 * @param view      view that will be animated
 * @param duration  for how long in ms will it shake
 * @param offset    start offset of the animation
 * @return          returns the same view with animation properties
 */
public static View makeMeShake(View view, int duration, int offset) {
    Animation anim = new TranslateAnimation(-offset,offset,0,0);
    anim.setDuration(duration);
    anim.setRepeatMode(Animation.REVERSE);
    anim.setRepeatCount(5);
    view.startAnimation(anim);
    return view;
}

використання:

TextView tv;
makeMeShake(tv,20,5);    // it will shake quite fast

Працює ідеально і дуже швидко.
Джордж Вріньос,

3

Я створив дуже хороший наближений тремтіння iOS (коли ви довго натискаєте піктограму, щоб видалити програму з головного екрану). Ви повинні застосувати всередині коду програмно, оскільки для цього потрібно генерувати випадкові числа:

int dur1 = 70 + (int)(Math.random() * 30);
int dur2 = 70 + (int)(Math.random() * 30);

// Create an animation instance
Animation an = new RotateAnimation(-3, 3, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);

// Set the animation's parameters
an.setDuration(dur1);               // duration in ms
an.setRepeatCount(-1);                // -1 = infinite repeated
an.setRepeatMode(Animation.REVERSE);
an.setFillAfter(true);               // keep rotation after animation


// Create an animation instance
Animation an2 = new TranslateAnimation(-TranslateAnimation.RELATIVE_TO_SELF,0.02f,
        TranslateAnimation.RELATIVE_TO_SELF,0.02f,
        -TranslateAnimation.RELATIVE_TO_SELF,0.02f,
        TranslateAnimation.RELATIVE_TO_SELF,0.02f);

// Set the animation's parameters
an2.setDuration(dur2);               // duration in ms
an2.setRepeatCount(-1);                // -1 = infinite repeated
an2.setRepeatMode(Animation.REVERSE);
an2.setFillAfter(true);               // keep rotation after animation

AnimationSet s = new AnimationSet(false);//false means don't share interpolators
s.addAnimation(an);
s.addAnimation(an2);

// Apply animation to image view
itemView.setAnimation(s);

Цей код був розроблений для застосування всередині gridview адаптера (getView), але ви можете застосувати до будь-якого подання, змінивши останній рядок на:

yourViewName.setAnimations (s);


здається, це нічого не робить
користувач25

Будь ласка, майте на увазі, що це буде працювати, лише якщо itemViewвоно ще не було додано до ViewGroup. Якщо його вже додали, використовуйте itemView.startAnimation(s)замість нього.
Олексій Семенюк

2

Для користувачів Kotlin:

Спочатку створіть файл ресурсу анімації під назвою shake.xml . Клацніть правою кнопкою миші папку res в Android Studio, а потім клацніть New> Android Resource File> введіть shake для імені файлу та виберіть спадний список Animation for Resource type. Клацніть OK.

Всередину shake.xmlвставте наступне:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate android:duration="200"
               android:fromXDelta="-5%"
               android:repeatCount="3"
               android:repeatMode="reverse"
               android:toXDelta="5%"/>
</set>

Тепер просто зателефонуйте йому на вигляд!

З фрагмента:

myView.startAnimation(AnimationUtils.loadAnimation(view!!.context, R.anim.shake))

Зсередини діяльності:

myView.startAnimation(AnimationUtils.loadAnimation(this, R.anim.shake))

(примітка - myViewце ідентифікатор, який надається поданню, яке ви хочете анімувати)

Якщо ви хочете налаштувати анімацію, просто змініть значення в shake.xml.


startAnimationі anim(всередині R.anim.shake) - це невирішені посилання, будь ласка, чи можете ви допомогти? подяка
Мафф

вам потрібно створити папку anim у каталозі res @Maff
Aditya Patil

0

Анімація коливань IOS - це не така проста спроба випадково змінити повороти x та y при обертанні. Вам слід програмно змінювати значення. Можливо, ви також можете одночасно використовувати анімацію перекладу


0

Стукаючи головою більше двох годин, я знав, як трястись і хитатися видом.

На жаль, прийнята відповідь не працюватиме окремо від onCreateView фрагмента.

Приклад, якщо у вас є метод onClick і всередині нього. У вас є анімація, як показано нижче, вона не буде працювати.

Будь ласка, пройдіть код.

    DoneStart.setOnClickListener(new OnClickListener() {

        @Override
        public void onClick(View view) {
           register(view);

        }
    });

Метод реєстру має деякі перевірки, як показано нижче

 private void register(View view) {
    String type = typedThings.getText.toString(); 
   String  km = Km_Now.getText().toString();

    if (serviceType == null) {
        animationServiceList = AnimationUtils.loadAnimation(getActivity(), R.anim.shake_wobble);
        silverServiceButton.setAnimation(animationServiceList);
        generalServiceButton.setAnimation(animationServiceList);
        platinumServiceButton.setAnimation(animationServiceList);
        animationServiceList.start();
    } else if (km == null) {
        animationEditText = AnimationUtils.loadAnimation(getActivity(), R.anim.shake_wobble);
        Km_Now.setAnimation(animationEditText);
        animationEditText.start();
    }

Виклик animationServiceList.start (); ніколи не покличуть,

РІШЕННЯ: Використовуйте PropertyAnimator, як ObjectAnimator.


0

Інші відповіді також правильні, але це трохи плавніше, ніж вони, оскільки він використовує інтерполятор, що дає плавні числа для руху вперед і назад

    public class WobblyView extends ImageView implements ValueAnimator.AnimatorUpdateListener {
    private final ValueAnimator va = ValueAnimator.ofInt(-10, 10);

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

    public WobblyView(Context context, @Nullable AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public WobblyView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        setAdjustViewBounds(true);
        setImageResource(R.drawable.ic_logo);
        va.setInterpolator(new AccelerateDecelerateInterpolator());
        va.setRepeatMode(ValueAnimator.REVERSE);
        va.setRepeatCount(ValueAnimator.INFINITE);
        va.setDuration(1000);
    }

    @Override
    protected void onAttachedToWindow() {
        super.onAttachedToWindow();
        va.addUpdateListener(this);
        va.start();
    }

    @Override
    protected void onDetachedFromWindow() {
        super.onDetachedFromWindow();
        va.removeUpdateListener(this);
    }

    @Override
    public void onAnimationUpdate(ValueAnimator animation) {
        int heading = (int) animation.getAnimatedValue();
        setRotation(heading);
    }
}
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.