I am creating phonebook like default android device .
I have already tired all possible solution available on this site but none of help me.
When user click on contact name , new layout should be open top to bottom.
But when I click on listItem animation not come bottom to top and layout does not display. However when I click again it show to effect of top to bottom sliding.
I found some problem here because when I put run without below animation its working fine.
bottom_up.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate android:fromYDelta="75%p" android:toYDelta="0%p"
android:fillAfter="true"
android:duration="500"/>
</set>
Below is my code
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<ListView
android:id="#+id/myListView"
android:layout_width="fill_parent"
android:layout_height="fill_parent" />
</RelativeLayout>
<LinearLayout
android:id="#+id/hidden_panel"
android:layout_gravity="bottom"
android:layout_width="match_parent"
android:layout_height="150dp"
android:orientation="vertical"
android:background="#2196F3"
>
<ImageView
android:id="#+id/imgBack"
android:padding="5dp"
android:layout_gravity="left|top"
android:src="#drawable/abc_ic_ab_back_mtrl_am_alpha"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
/>
</LinearLayout>
</FrameLayout>
hiddenPanel = (ViewGroup)findViewById(R.id.hidden_panel);
hiddenPanel.setVisibility(View.INVISIBLE);
isPanelShown = false;
list.setOnItemClickListener(new OnItemClickListener() {
#Override
public void onItemClick(AdapterView<?> arg0, View arg1, int arg2, long arg3) {
// TODO Auto-generated method stub
if(isPanelShown==false)
{
Animation bottomUp = AnimationUtils.loadAnimation(getApplicationContext(),
R.anim.bottom_up);
ViewGroup hiddenPanel = (ViewGroup)findViewById(R.id.hidden_panel);
hiddenPanel.startAnimation(bottomUp);
hiddenPanel.setVisibility(View.VISIBLE);
isPanelShown=true;
}
else
{
Animation bottomUp = AnimationUtils.loadAnimation(getApplicationContext(),
R.anim.bottom_down);
ViewGroup hiddenPanel = (ViewGroup)findViewById(R.id.hidden_panel);
hiddenPanel.startAnimation(bottomUp);
hiddenPanel.setVisibility(View.INVISIBLE);
isPanelShown=false;
}
}
});
Related
Why is my setAnimation not working in LongClickListener where as it is working fine in outside the LongClick listener?
This is my java code for adding animation
final Animation shake = AnimationUtils.loadAnimation(NavyashActivity.context, R.anim.shake);
final CardView breakfast = (CardView) rootView.findViewById(R.id.breakfastcard);
breakfast.setOnLongClickListener(new View.OnLongClickListener() {
#Override
public boolean onLongClick(View v) {
Log.e("shake long press","coming ");
// TODO Auto-generated method stub
breakfast.setAnimation(shake);
return true;
}
});
Also my shake.xml is as:
<?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: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>
and my layout for cardview for which i need shaking is:
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="15dp"
android:foreground="?android:attr/selectableItemBackground"
android:longClickable="true"
android:clickable="true"
android:id="#+id/breakfastcard">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:background="#drawable/framebox">
<TextView
android:layout_width="wrap_content"
android:id="#+id/breakfastheading"
android:gravity="center_horizontal"
android:layout_gravity="center_horizontal"
android:layout_height="wrap_content"
android:layout_marginBottom="2dp"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/breakfastdetails"
android:layout_margin="2dp"/>
</LinearLayout>
</android.support.v7.widget.CardView>
I just want that as soon as the user Longclicks the cardview element the card should start shaking so as to notify that on being touched for long time its moving continuosly.
Try to change this:
breakfast.setAnimation(shake);
To this:
breakfast.startAnimation(shake);
You are setting the animation but not starting it.
I am making a simple calculator application for android. I've already made the code and everything works fine. However, I want to improve the design of its user interface by adding a little animation for the changing of text. So it's like this for example:
I will enter input via the buttons to the edittext, say for example, "2+3".
When I will press the enter button, "2+3" moves up and disappears then "5", from below, replaces the original position of "2+3".
How can I do this?
This should answer your question now that I understand it a little better. You just need a couple of animation files, one to slide the text out, and one to slide it in. You can adjust the animations however you would like:
Here is your click listener for the equals button:
Button btnEquals = (Button)findViewById(R.id.btnEquals);
btnEquals.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
Animation slideOutBottom = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.out_bottom);
slideOutBottom.setAnimationListener(new Animation.AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
// Update the text here
Animation slideInTop = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.in_top);
llContainer.startAnimation(slideInTop);
}
#Override
public void onAnimationRepeat(Animation animation) {
}
});
llContainer.startAnimation(slideOutBottom);
}
});
}
And here are the out_bottom.xml and in_top.xml files (respectively) that go in your anim folder:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate android:fromYDelta="0%" android:toYDelta="100%" android:duration="600"/>
</set>
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate android:fromYDelta="-100%" android:toYDelta="0%" android:duration="600"/>
</set>
And here is how I wrapped the layouts. Kind of quick and dirty, but it works:
<LinearLayout 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">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="40dp"
android:gravity="center_vertical"
android:background="#fff">
<LinearLayout
android:id="#+id/llContainer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_vertical">
<EditText
android:id="#+id/edtInput"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="top"
android:padding="5dp"
android:background="#null"/>
</LinearLayout>
</LinearLayout>
<Button
android:id="#+id/btnEquals"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="="/>
</LinearLayout>
I would like to make a popup box like facebook android app which opens up on pressing the comments button. i want to design the same kind of pop-up for my application . Can anyone let me know how it can be build or just guide me what is the requirement to design that kind of thing.
Thanks.
you can achieve it through
PopupWindow
Here is the procedure of calling popup window over activity or fragment.
Facebook using Rebound Library for awesome swing animations. But i used normal xml animation files for that.
popup_layout.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/headerLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"
android:orientation="horizontal"
android:layout_alignParentTop="true"
android:gravity="center">
<TextView
android:layout_gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Some One and 20 Others Like this"
android:textColor="#color/black"
android:textStyle="bold"
android:layout_margin="5dp"/>
</LinearLayout>
<ListView
android:id="#+id/commentsListView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/headerLayout"
android:layout_above="#+id/comment_section"
android:layout_marginBottom="0dp"/>
<LinearLayout
android:id="#+id/comment_section"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="50dp"
android:layout_alignParentBottom="true"
android:layout_marginBottom="5dp"
android:orientation="horizontal"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:gravity="center"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:maxHeight="30dp"
android:minHeight="20dp"
android:layout_gravity="center"
android:src="#mipmap/ic_launcher"
/>
<EditText
android:id="#+id/writeComment"
android:hint="Write a Comment"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:maxLines="2"
android:focusable="true"
android:layout_marginLeft="2dp"
android:textSize="12sp"
android:textColor="#color/black"
android:background="#00000000"/>
</LinearLayout>
</RelativeLayout>
popup Animation in style.xml
<!-- PopuP Enter Exit Animation -->
<style name="PopupAnimation" parent="Widget.AppCompat.PopupWindow">
<item name="android:windowEnterAnimation">#anim/bottom_up</item>
<item name="android:windowExitAnimation">#anim/bottom_down</item>
</style>
Java Method to call PopUpWindow
// call this method when required to show popup
public void onShowPopup(View v){
LayoutInflater layoutInflater = (LayoutInflater)getSystemService(Context.LAYOUT_INFLATER_SERVICE);
// inflate the custom popup layout
inflatedView = layoutInflater.inflate(R.layout.popup_layout, null,false);
// find the ListView in the popup layout
ListView listView = (ListView)inflatedView.findViewById(R.id.commentsListView);
LinearLayout headerView = (LinearLayout)inflatedView.findViewById(R.id.headerLayout);
// get device size
Display display = getWindowManager().getDefaultDisplay();
final Point size = new Point();
display.getSize(size);
// mDeviceHeight = size.y;
DisplayMetrics displayMetrics = mContext.getResources().getDisplayMetrics();
int width = displayMetrics.widthPixels;
int height = displayMetrics.heightPixels;
// fill the data to the list items
setSimpleList(listView);
// set height depends on the device size
popWindow = new PopupWindow(inflatedView, width,height-50, true );
// set a background drawable with rounders corners
popWindow.setBackgroundDrawable(getResources().getDrawable(R.drawable.popup_bg));
popWindow.setInputMethodMode(PopupWindow.INPUT_METHOD_NEEDED);
popWindow.setHeight(WindowManager.LayoutParams.WRAP_CONTENT);
popWindow.setAnimationStyle(R.style.PopupAnimation);
// show the popup at bottom of the screen and set some margin at bottom ie,
popWindow.showAtLocation(v, Gravity.BOTTOM, 0,100);
}
Method for adding list into layout
void setSimpleList(ListView listView){
ArrayList<String> contactsList = new ArrayList<String>();
for (int index = 0; index < 10; index++) {
contactsList.add("I am # index " + index + " today " + Calendar.getInstance().getTime().toString());
}
listView.setAdapter(new ArrayAdapter<String>(MainActivity.this,
R.layout.popup_list_item, android.R.id.text1, contactsList));
}
Animation File
bottom_up.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate android:fromYDelta="75%p" android:toYDelta="0%p"
android:fillAfter="true"
android:duration="400"/>
</set>
bottom_down.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate android:fromYDelta="0%p" android:toYDelta="100%p" android:fillAfter="true"
android:interpolator="#android:anim/linear_interpolator"
android:duration="400" />
</set>
I am trying to make animation of group of buttons sliding in and out but I am struggling with one problem.
Current animation is moving correctly but is sliding out from the very left of the screen. Just where is the button used to show up this. So this makes whole animation looks bad, because this group is sliding on this.
What I want to achieve is add some margin, or something similar that will make start of the animation just from the point where is the button.
I want it to look like this:
That means those 3 images will start showing from this white line, not from the very left of the screen.
Main activity onCreate, where everything is going on:
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
image1 = (LinearLayout)findViewById(R.id.imageLayout);
button = (Button)findViewById(R.id.buttonShow);
animationSlideInLeft = AnimationUtils.loadAnimation(this,
R.anim.push_right_in);
animationSlideOutRight = AnimationUtils.loadAnimation(this,
R.anim.push_left_out);
animationSlideInLeft.setDuration(1000);
animationSlideOutRight.setDuration(1000);
animationSlideInLeft.setAnimationListener(animationSlideInLeftListener);
animationSlideOutRight.setAnimationListener(animationSlideOutRightListener);
button.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v)
{
if(v == button)
{
if(!on)
{
curSlidingImage = image1;
image1.startAnimation(animationSlideInLeft);
image1.setVisibility(View.VISIBLE);
on = true;
}
else
{
image1.startAnimation(animationSlideOutRight);
image1.setVisibility(View.INVISIBLE);
on = false;
}
}
}
});
}
animations files:
push_right_in
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<translate
android:duration="300"
android:fromXDelta="-100%p"
android:toXDelta="0" />
<alpha
android:duration="300"
android:fromAlpha="0.0"
android:toAlpha="1.0" />
</set>
push_left_out
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<translate
android:duration="300"
android:fromXDelta="0"
android:toXDelta="-100%p" />
<alpha
android:duration="300"
android:fromAlpha="1.0"
android:toAlpha="0.0" />
</set>
main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<Button
android:id="#+id/buttonShow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Btn" />
<LinearLayout
android:id="#+id/imageLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="invisible" >
<ImageView
android:id="#+id/image1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/icon" />
<ImageView
android:id="#+id/image2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/icon" />
<ImageView
android:id="#+id/image3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/icon" />
</LinearLayout>
</LinearLayout>
try this code:
TranslateAnimation anim = new TranslateAnimation(-50, 0, 0, 0);
anim.setStartOffset(0);
anim.setDuration(3000);
imageView.startAnimation(anim);
Hope it Helps!!
You can add Padding to the parent Relative layout in this case the animations starts from padding like this
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingRight="64dp">
this is my code for animated image is work fine but i want to add green illuminated lighting border around image how i do this? like this image http://imgur.com/qg0JM0q ?
for fade in fade out on image rounded border???
public class MainActivity extends Activity {
Button btnAnimation, btnAnimation1, btnAnimation2;
Animation performAnimation, performAnimation1, performAnimation2;
ImageView androidImageView;
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
performAnimation1 = AnimationUtils.loadAnimation(this, R.layout.animation1);
performAnimation1.setRepeatCount(4);
androidImageView = (ImageView)findViewById(R.id.androidImageView);
btnAnimation1 = (Button)findViewById(R.id.btn_animation1);
btnAnimation1.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
androidImageView.startAnimation(performAnimation1);
}
});
}
}
<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" >
<ImageView
android:id="#+id/androidImageView"
android:layout_width="30dp"
android:layout_height="40dp"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="192dp"
android:adjustViewBounds="false"
android:src="#drawable/alertlogo" />
<Button
android:id="#+id/btn_animation1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/androidImageView"
android:layout_below="#+id/btn_animation"
android:text="perform animation 2" />
</RelativeLayout>
<!------------ animation1.xml---->
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="#android:anim/decelerate_interpolator">
<alpha
android:fromAlpha="0.0"
android:toAlpha="1.0"
android:interpolator="#android:anim/accelerate_interpolator"
android:duration="8000" />
</set>