So I have this animation I have been working on. Essentially, when you click the image all it does is simply animate the image to a new Y coordinate. Note: Keep in mind that my images are all scaled appropriately for mdli, hdpi, xhdpi etc. So I have 2 problems: 1 . When I use .setY on an image view, the y coordinate is loaded differently on other phones. 2 . When I use both my image and txt animate methods, they both animate to different y coordinates based on different phones/screens. So my question is how do I fix both of these problems so that they are consistent across all screen sizes?
public class MainActivity extends Activity {
final String tag = "My activity";
ImageView mWhatsTheAnswerImg, mInspireMeImg, mHelpMeThink, mTalkToVince;
ObjectAnimator mImageAnimation, mTxtAnimation;
TextView mWhatsTheAnswerText, mInspireMeTxt, mHelpMeThinkTxt, mTalkToVinceTxt;
boolean mWhatsTheAnswerBOOL, mInspireMeBOOL, mHelpMeThinkBOOL, mTalkToVinceBOOL =false;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ActionBar actionBar = getActionBar();
actionBar.hide();
mInspireMeImg = (ImageView) findViewById(R.id.inspireme);
mInspireMeImg.setY(750);
mInspireMeTxt = (TextView) findViewById(R.id.inspireMeTxt);
mInspireMeTxt.setY(750);
mInspireMeImg.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
if (mInspireMeBOOL) {
imageAnimate(mInspireMeImg, 750);
txtAnimate(mInspireMeTxt, 750);
Log.w(tag, "DOWN Coordinates: " + mInspireMeImg.getY() + "Txt: " + mInspireMeTxt.getY());
mInspireMeBOOL = false;
} else {
mInspireMeBOOL = true;
imageAnimate(mInspireMeImg, +290);
txtAnimate(mInspireMeTxt, +290);
Log.w(tag, "UP Coordinates: " + mInspireMeImg.getY() + "Txt: " + mInspireMeTxt.getY());
}
}
});
Image animate and txt animate methods:
private void imageAnimate(ImageView img, float YCoordinates){
mImageAnimation =ObjectAnimator.ofFloat(img, View.TRANSLATION_Y,YCoordinates);
Log.w(tag, "IMG Coordinates: " + img.getY());
mImageAnimation.setDuration(1000);
mImageAnimation.start();
}
private void txtAnimate(TextView txt, float YCoordinates){
mTxtAnimation = ObjectAnimator.ofFloat(txt, View.TRANSLATION_Y, YCoordinates);
Log.w(tag, "TXT Coordinates: " + txt.getY());
mTxtAnimation.setDuration(1000);
mTxtAnimation.start();
}
}
Edit: 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.wyatt.avinceandroid.app.MainActivity">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/Background"
android:src="@drawable/coachvincebackground"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"
android:scaleType="fitXY"/>
<ImageView
android:layout_width="match_parent"
android:layout_height="1000dp"
android:id="@+id/inspireme"
android:src="@drawable/inspiremescreen"
android:scaleType="fitXY"
android:layout_centerVertical="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="Large Text"
android:id="@+id/inspireMeTxt"
android:layout_alignTop="@+id/helpMeThink"
android:layout_centerHorizontal="true"
android:layout_marginTop="89dp" />
<ImageView
android:layout_width="match_parent"
android:layout_height="1000dp"
android:id="@+id/helpMeThink"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="71dp"
android:src="@drawable/helpmethinkscreen"
android:scaleType="fitXY"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="Large Text"
android:id="@+id/helpMeThinkTxt"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true" />
<ImageView
android:layout_width="match_parent"
android:layout_height="1000dp"
android:id="@+id/whatsTheAnswer"
android:src="@drawable/whatstheanswerscreen"
android:scaleType="fitXY"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="Large Text"
android:id="@+id/whatsTheAnswerTxt"
android:layout_alignTop="@+id/AskVince"
android:layout_alignLeft="@+id/inspireMeTxt"
android:layout_alignStart="@+id/inspireMeTxt" />
<ImageView
android:layout_width="match_parent"
android:layout_height="1000dp"
android:id="@+id/AskVince"
android:src="@drawable/askvincescreen"
android:scaleType="fitXY"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="Large Text"
android:id="@+id/askVinceTxt"
android:layout_below="@+id/helpMeThinkTxt"
android:layout_centerHorizontal="true" />
</RelativeLayout>
The setY
and other similar methods expect values in pixels. Now, this is exactly where the problem lies. Different phones have screens of different resolutions and so the 750th pixel will be located at different positions on different phones unless two displays are identical.
The solution is simple. Use values in DP
:
mInspireMeImg.setY(dpToPx(750));
and keep this method stored somewhere:
public static int dpToPx(float dpValue, Context context){
return (int)TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, dpValue, context.getResources().getDisplayMetrics());
}
More about DP
unit:
http://developer.android.com/training/multiscreen/screendensities.html
What is the difference between "px", "dp", "dip" and "sp" on Android?
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.