I am trying to animate an ImageView with a background image. The animation loads fine during the first time but after that becomes laggy and no animation appears.
file ---- main.xml
<ImageView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="31dp"
/>
<Button
android:id="#+id/button2"
style="?android:attr/buttonStyleSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#+id/editText1"
android:layout_marginRight="30dp"
android:layout_marginTop="52dp"
android:text="Click me" />
file ---- TutorialActivity.java
private isClicked = 0;
private Animation animUp;
private Animation animDown;
animUp = AnimationUtils.loadAnimation(this, android.R.anim.slide_in_left);
animDown = AnimationUtils.loadAnimation(this, android.R.anim.slide_in_left);
animUp.setDuration(500);
animDown.setDuration(500);
Button clickButton = (Button) findViewById(R.id.button2);
clickButton.setOnClickListener(new OnClickListener(){
#Override
public void onClick(View v)
{
if(isClicked == 0)
{
menu.setVisibility(View.VISIBLE);
menu.setAnimation(animUp);
isClicked = 1;
}
else
{
menu.setAnimation(animDown);
menu.setVisibility(View.GONE);
isClicked = 0;
}
}
Every time you use animation you should set animation start time. Any way you prefer, from simple animation.startNow() to more complex animation.setStartTime(time); animation.start().
Related
I'm making a soundboard and when the user clicks the buttons a sound byte is supposed to play. I'm pretty sure that my logic in the code is correct to set the sounds to each button as I searched for an off by one error in my for loop. For some reason there is always only one random button on the screen that doesn't play its sound when clicked and the button that doesn't work changes every time I run the code. I think its an error in my XML because every time I change the XML to try to fix it a different button is the one that doesn't work.
<?xml version="1.0" encoding="utf-8"?>
<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:orientation="vertical"
tools:context="com.example.ben.soundboard.MainActivity"
>
<ImageButton
android:id="#+id/button1"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_alignTop="#+id/button2"
android:layout_alignStart="#+id/button4" />
<ImageButton
android:id="#+id/button2"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_alignTop="#+id/button3"
android:layout_alignStart="#+id/button5" />
<ImageButton
android:id="#+id/button3"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_alignStart="#+id/button6"
android:layout_marginTop="93dp" />
<ImageButton
android:id="#+id/button4"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_alignTop="#+id/button5"
android:layout_alignStart="#+id/button7" />
<ImageButton
android:id="#+id/button5"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_alignTop="#+id/button6"
android:layout_alignStart="#+id/button8" />
<ImageButton
android:id="#+id/button6"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_centerVertical="true"
android:layout_alignStart="#+id/button9" />
<ImageButton
android:id="#+id/button7"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_alignTop="#+id/button8"
android:layout_marginStart="38dp" />
<ImageButton
android:id="#+id/button8"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_alignTop="#+id/button9"
android:layout_centerHorizontal="true" />
<ImageButton
android:id="#+id/button9"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_marginEnd="49dp"
android:layout_marginBottom="106dp"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true" />
public class MainActivity extends AppCompatActivity
{
#Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
MediaPlayer ohBaby = MediaPlayer.create(this,R.raw.oh_baby);
MediaPlayer fourTwentySount = MediaPlayer.create(this,R.raw.four_twenty);
MediaPlayer anotherOne = MediaPlayer.create(this,R.raw.another_one);
MediaPlayer terrorist_win = MediaPlayer.create(this,R.raw.terrorists_win);
MediaPlayer allahu_akbar = MediaPlayer.create(this,R.raw.allahu_akbar);
MediaPlayer cough = MediaPlayer.create(this,R.raw.cough);
MediaPlayer that_was_easy = MediaPlayer.create(this,R.raw.that_was_easy);
MediaPlayer horn = MediaPlayer.create(this,R.raw.horn);
MediaPlayer ethan_bradberry = MediaPlayer.create(this,R.raw.im_ethan_bradberry);
MediaPlayer[] sounds = {ohBaby,fourTwentySount,anotherOne,terrorist_win,allahu_akbar,cough,that_was_easy,horn,ethan_bradberry};
ImageButton button1 = (ImageButton) findViewById(R.id.button1);
ImageButton button2 = (ImageButton) findViewById(R.id.button2);
ImageButton button3 = (ImageButton) findViewById(R.id.button3);
ImageButton button4 = (ImageButton) findViewById(R.id.button4);
ImageButton button5 = (ImageButton) findViewById(R.id.button5);
ImageButton button6 = (ImageButton) findViewById(R.id.button6);
ImageButton button7 = (ImageButton) findViewById(R.id.button7);
ImageButton button8 = (ImageButton) findViewById(R.id.button8);
ImageButton button9 = (ImageButton) findViewById(R.id.button9);
ImageButton[] buttons = {button1,button2,button3,button4,button5,button6,button7,button8,button9};
for (int i = 0; i < 9;i++) {
buttons[i].setImageResource(R.drawable.ic_action_name);
setButtonSound(buttons[i],sounds[i]);
}
}
public void setButtonSound(ImageButton btn, final MediaPlayer sound)
{
btn.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
sound.start();
}
});
}
}
You have not a common implementation, but before start a new sound, stop the reproduction in any MediaPlayer:
for (int i = 0; i < 9;i++) {
sounds[i].stop();
}
And then use the method prepare() before start():
sound.prepare();
sound.start();
I think that your problem is that you are creating several MediaPlayers at the same time but you have to stop playing before start to reproduce a new "sound" with another MediaPlayer.
I am developing a simple game and in an activity I have 2 image buttons:
<ImageButton
android:id="#+id/btn1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#string/desc"
android:src="#drawable/img1"
android:onClick="btn1_click" />
<ImageButton
android:id="#+id/btn2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#string/desc"
android:src="#drawable/img2"
android:onClick="btn2_click" />
And I am showing some animations when buttons are clicked:
public void btn1_click(View v) {
v.startAnimation(animLeftTranslate);
}
public void btn2_click(View v) {
v.startAnimation(animRightTranslate);
}
Of course, only the clicked button is being animated but what I want to do is to show animation for both two buttons when one of them are clicked. How can I do this?
Instead of using android:onClick, you can do it in java code:
ImageButton btn1 = (ImageButton) findViewById(R.id.bt1);
ImageButton btn2 = (ImageButton) findViewById(R.id.bt2);
View.OnClickListener listener = new View.OnClickListener() {
#Override
public void onClick(View v) {
btn1.startAnimation(animRightTranslate);
btn2.startAnimation(animRightTranslate);
}
};
btn1.setOnClickListener(listener);
btn2.setOnClickListener(listener);`
`
You can accomplish this by your own approach i.e. using android:onClick attribute:
Assign one function to both ImageButton for example btns_clicked(). So add android:onClick='btns_clicked' to both your buttons. And in that function write:
public void btns_clicked(View v) {
View btn1 = findViewById(R.id.btn1);
View btn2 = findViewById(R.id.btn2);
btn1.startAnimation(animLeftTranslate);
btn2.startAnimation(animRightTranslate);
}
you can do this as describe below.
<ImageButton
android:id="#+id/btn1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#string/desc"
android:src="#drawable/img1"
android:onClick="btn_click" />
<ImageButton
android:id="#+id/btn2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#string/desc"
android:src="#drawable/img2"
android:onClick="btn_click" />
and in activity, you have to use
public void btn_click(View v) {
if(v.getId() == R.id.btn1)
v.startAnimation(animLeftTranslate);
else if(v.getId() == R.id.btn2)
v.startAnimation(animRightTranslate);
}
I have seen questions/solutions here for the keyboard not showing up, but none relating to my specific issue. When you click an EditText, the keyboard shows up fine. But, when I animate the EditText first, then when you click the EditText the keyboard will NOT show up.
Any ideas why this could be happening?
In my Activity I first animate my logo, and after it's done animating I create a fade-in animation for the EditTexts. After they finish the animation, I try and click any of them but the keyboard will not show up.
Here is my onCreate method in my Activity:
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
this.requestWindowFeature(Window.FEATURE_NO_TITLE); //Remove title bar
setContentView(R.layout.login);
final EditText emailField = (EditText) findViewById(R.id.emailField);
final EditText passwordField = (EditText) findViewById(R.id.passwordField);
final TextView logInText = (TextView) findViewById(R.id.logInText);
final Button signupButton = (Button) findViewById(R.id.signupButton);
final Button loginButton = (Button) findViewById(R.id.loginButton);
//animation of logo
ImageView img_animation = (ImageView) findViewById(R.id.encoreLogo);
TranslateAnimation animation = new TranslateAnimation(0.0f, 00f,
0.0f, -400.0f);
animation.setDuration(4000);
animation.setFillAfter(true);
animation.setStartOffset(2000);
img_animation.startAnimation(animation);
animation.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationEnd(Animation animation) {
Animation animFadeIn = AnimationUtils.loadAnimation(getApplicationContext(), android.R.anim.fade_in);
animFadeIn.setDuration(2000);
animFadeIn.setFillAfter(true);
emailField.setAnimation(animFadeIn);
passwordField.setAnimation(animFadeIn);
logInText.setAnimation(animFadeIn);
loginButton.setAnimation(animFadeIn);
signupButton.setAnimation(animFadeIn);
}
#Override
public void onAnimationRepeat(Animation animation) {}
#Override
public void onAnimationStart(Animation animation) {}
});
signupButton.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
Intent myIntent = new Intent(MainActivity.this, SignUpActivity.class);
MainActivity.this.startActivity(myIntent);
}
});
}
and here is my corresponding login.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=".MainActivity" >
<ImageView
android:id="#+id/backroundImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:cropToPadding="false"
android:scaleType="centerCrop"
android:src="#drawable/crowdblur1" />
<ImageView
android:id="#+id/encoreLogo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:adjustViewBounds="true"
android:maxHeight="#dimen/thumbnail_height"
android:maxWidth="#dimen/thumbnail_width"
android:scaleType="centerInside"
android:src="#drawable/hand72" />
<TextView
android:id="#+id/logInText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/encoreLogo"
android:layout_alignLeft="#+id/passwordField"
android:layout_centerHorizontal="true"
android:layout_centerInParent="true"
android:layout_marginBottom="79dp"
android:paddingLeft="#dimen/left_padding_login_text"
android:text="Login to Encore"
android:textColor="#android:color/white"
android:textSize="#dimen/log_in_text"
android:textStyle="bold"
android:visibility="invisible" />
<EditText
android:id="#+id/emailField"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/encoreLogo"
android:layout_centerHorizontal="true"
android:layout_marginBottom="18dp"
android:background="#drawable/rounded_corners"
android:ems="10"
android:inputType="textEmailAddress"
android:hint="Email"
android:textColor="#android:color/black"
android:textStyle="italic"
android:visibility="invisible" />
<EditText
android:id="#+id/passwordField"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/encoreLogo"
android:layout_centerHorizontal="true"
android:background="#drawable/rounded_corners"
android:ems="10"
android:inputType="textPassword"
android:hint="Password"
android:textStyle="italic"
android:textColor="#android:color/black"
android:visibility="invisible" />
<Button
android:id="#+id/signupButton"
style="?android:attr/buttonStyleSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/loginButton"
android:layout_centerHorizontal="true"
android:layout_marginTop="22dp"
android:background="#android:color/transparent"
android:text="#string/signUp"
android:textColor="#5FC2FF"
android:textSize="#dimen/signupText"
android:textStyle="bold"
android:visibility="invisible" />
<Button
android:id="#+id/loginButton"
style="?android:attr/buttonStyleSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/passwordField"
android:layout_centerHorizontal="true"
android:layout_marginTop="14dp"
android:background="#android:color/transparent"
android:text="#string/login"
android:textColor="#android:color/white"
android:textSize="#dimen/signupText"
android:visibility="invisible" />
Thanks in advance!
So it seems that when you have the visibility set to INVISIBLE on the EditText fields it doesn't want to get focus.
I fixed this issue by changing the visibility on those fields after the animation completes like this:
animFadeIn.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationEnd(Animation animation) {
emailField.setVisibility(View.VISIBLE);
passwordField.setVisibility(View.VISIBLE);
logInText.setVisibility(View.VISIBLE);
loginButton.setVisibility(View.VISIBLE);
signupButton.setVisibility(View.VISIBLE);
}
#Override
public void onAnimationStart(Animation animation) {}
#Override
public void onAnimationRepeat(Animation animation) {}
});
Hope this helps you :)
It seems like you want to wait for the image (logo) to finish its animation then start the animations for TextView and EditView. Instead of using setAnimationListener what you can do is set the start offset value of animFadeIn to 4000 miliseconds.
Try this:
TranslateAnimation animation = new TranslateAnimation(0.0f, 00f,
0.0f, -400.0f);
animation.setDuration(4000);
animation.setFillAfter(true);
animation.setStartOffset(2000);
img_animation.startAnimation(animation);
Animation animFadeIn = AnimationUtils.loadAnimation(getApplicationContext(), android.R.anim.fade_in);
animFadeIn.setDuration(2000);
animFadeIn.setStartOffset(4000);
animFadeIn.setFillAfter(true);
emailField.setAnimation(animFadeIn);
passwordField.setAnimation(animFadeIn);
logInText.setAnimation(animFadeIn);
loginButton.setAnimation(animFadeIn);
signupButton.setAnimation(animFadeIn);
The keyboard opens up fine for me.
Had the same problem. Just don't use fillAfter, it's crap. Combine with #Wextux's solution.
There are different types of Animations,
You are using the wrong type of animation! You want to use ObjectAnimator.
I am trying to make an animation with two textviews. Both are in a relative layout. The functionality of the animation is left textview will go little bit left and at the same time right textview will also go little bit left. I have tried:
http://nineoldandroids.com/ and default way.
But for both case I am getting a gap during the process. I already put one question but i am not getting any positive reply:
Android slider animation is not synchronized
Nineoldandroids code:
xml file:
<RelativeLayout
android:layout_width="match_parent" android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_below="#+id/target"
android:layout_marginTop="50dp">
<TextView
android:id="#+id/TextView01"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_alignParentLeft="true"
android:background="#f00"
android:gravity="center"
android:text="RED"
android:textColor="#000" />
<Button
android:id="#+id/TextView02"
android:layout_width="50dp"
android:layout_height="match_parent"
android:layout_alignBottom="#+id/TextView01"
android:layout_alignParentRight="true"
android:layout_alignTop="#+id/TextView01"
android:background="#0F0"
android:text="TXT"
android:visibility="invisible" />
</RelativeLayout>
MainActivity.java:
public class MainActivity extends Activity {
double counter = 0;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.toggles);
final View target = findViewById(R.id.target);
final int duration = 5*1000;
final int duration1 = 300;
final View textView1 = findViewById(R.id.TextView01);
final View textView2 = findViewById(R.id.TextView02);
textView1.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
if (counter == 0) {
textView2.setVisibility(View.VISIBLE);
ObjectAnimator.ofFloat(textView1, "translationX", 0, -50).setDuration(duration1).start();
ObjectAnimator.ofFloat(textView2, "translationX", 100, 0).setDuration(duration1).start();
counter++;
}
else {
ObjectAnimator.ofFloat(textView1, "translationX", -50,0).setDuration(duration1).start();
ObjectAnimator.ofFloat(textView2, "translationX", 0,100).setDuration(duration1).start();
counter--;
}
}
});
}
}
How can I fix it?
otherwise I am trying to put both textview inside a layout where second textview will be outside the screen and using the animation I will move the whole layout. how can I make the xml like this?
Sorry for misunderstanding your question.
Anyway, your issue is not about time exactly. Both animations have the same duration but the problem is the sizes of the animated regions are different. Logically, moving a longer distance in the same duration will look slower than moving a smaller distance.
For example, to solve your problem, I used the following code in the OnClickListener:
public void onClick(View v) {
int width =textView2.getWidth();
if (counter == 0) {
textView2.setVisibility(View.VISIBLE);
ObjectAnimator.ofFloat(textView1, "translationX", 0, -1*width).setDuration(duration1).start();
ObjectAnimator.ofFloat(textView2, "translationX", 1*width, 0).setDuration(duration1).start();
counter++;
}
else {
ObjectAnimator.ofFloat(textView1, "translationX", -1*width, 0).setDuration(duration1).start();
ObjectAnimator.ofFloat(textView2, "translationX", 0, 1*width).setDuration(duration1).start();
counter--;
}
}
Try this
<!-- YOUR CONTAINER -->
<LinearLayout
android:id="#+id/target"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/target"
android:layout_marginTop="50dp"
android:orientation="horizontal" >
<TextView
android:id="#+id/TextView01"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_alignParentLeft="true"
android:background="#f00"
android:gravity="center"
android:text="RED"
android:textColor="#000" />
<Button
android:id="#+id/TextView02"
android:layout_width="50dp"
android:layout_height="match_parent"
android:layout_alignBottom="#+id/TextView01"
android:layout_alignParentRight="true"
android:layout_alignTop="#+id/TextView01"
android:background="#0F0"
android:text="TXT"
android:visibility="invisible" />
</LinearLayout>
Then use a ViewPropertyAnimator like this (if you can use it)
//Translate your view -50 to the left.
yourLinearLayout.animate().translationX(-50).setDuration(1000);
With the ObjectAnimator I achieved the same results by using this code
Button textView02 = (Button) findViewById(R.id.textView02);
LinearLayout target = (LinearLayout) findViewById(R.id.target);
int width = textView02.getWidth();
ObjectAnimator.ofFloat(target, "translationX", 0, -width).setDuration(1000).start();
Hope this helps you
Im new to android..please guide me..
I want to set image to act as button..
How to implement this in xml and in class file?
I now the code to set button in xml and class file like this..
<Button
android:id="#+id/nxt_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#+id/rdtxt"
android:layout_marginRight="22dp"
android:layout_marginTop="34dp"
android:text="Next" />
Button nextBtn = (Button) findViewById(R.id.nxt_btn);
I want practice.png this image want to act as button..I have put this image into drawables..
Now how to implement this by code...please guide me...
Thank a lot...
In xml you can add:
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/image" />
And in Activity:
ImageView image = (ImageView) findViewById(R.id.image);
image.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View arg0) {
//Do your stuff here
}
});
In a xml file:-
<Button
android:id="#+id/nxt_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#+id/rdtxt"
android:layout_marginRight="22dp"
android:background="#drawable/practice"
android:layout_marginTop="34dp" />
or
In a Activity :-
Button nextBtn = (Button) findViewById(R.id.nxt_btn);
nextBtn.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View arg0) {
//Do your stuff here
}
});
Use ImageButton. You can set an image to it using android:src="#drawable/myImage" and you can set OnClickListener to it.
For example :
<ImageButton
android:id="#+id/nxt_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#+id/rdtxt"
android:layout_marginRight="22dp"
android:layout_marginTop="34dp"
android:src="#drawable/next_btn_img" />
ImageButton next = (ImageButton) findViewById(R.id.nxt_btn);