I'm making a speedometer and I'm centering the needle via a setTranslation(). All works almost well in LANDSCAPE mode but when changing the orientation of the emulator to PORTRAIT, the needle has an offset towards the left + top(+x, +y).
The sizes of my bitmap objects are:
speedo_meter(H x W): 89 x 20
needle(H x W): 344 x 313
But when using getWidth() and getHeight and displaying them with Log.d the values are different(see the end of the question for the LogCat).
Can anyone explain the cause of the difference in values and the offset in PORTRAIT mode?
Here's an example of what I'm trying to do:
Here's the onDraw() method containing the Matrix:
protected void onDraw(Canvas canvas) {
canvas.drawBitmap(speedo_meter, (canvas.getWidth() / 2) - speedo_meter.getWidth() / 2,
(canvas.getHeight() / 3) - speedo_meter.getHeight() / 2, null);
// Main Meter Needle
matrix_needle.setTranslate((canvas.getWidth() / 2) - needle.getWidth() / 2,
(canvas.getHeight() / 3)- needle.getHeight());
// Log.d("ANGLE OF DEVIATION : ","" + angle_of_deviation);
Log.d("CANVAS HEIGHT : ","" + canvas.getHeight());
Log.d("CANVAS WIDTH : ","" + canvas.getWidth());
Log.d("METER HEIGHT : ","" + speedo_meter.getHeight());
Log.d("METER WIDTH : ","" + speedo_meter.getWidth());
Log.d("NEEDLE HEIGHT : ","" + needle.getHeight());
Log.d("NEEDLE WIDTH : ","" + needle.getWidth());
Log.d("MATRIX : ","" + matrix_needle.toString());
matrix_needle.postRotate(angle_of_deviation, canvas.getWidth() / 2, 2 * needle.getHeight() - 10);
canvas.drawBitmap(needle, matrix_needle, paint_needle);
// Main Meter Wheel
canvas.drawBitmap(center_wheel, (canvas.getWidth() / 2)- center_wheel.getWidth() / 2,
(canvas.getHeight() / 3)- center_wheel.getHeight() / 2, null);
}
I'm creating a custom view like this:
public SpeedometerView(Context context) {
super(context);
initializeView(context);
}
public SpeedometerView(Context context, AttributeSet attrs) {
super(context, attrs);
initializeView(context);
}
public SpeedometerView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
initializeView(context);
}
//Create view
private void initializeView(Context context) {
this.context = context;
speedo_obj = this;
this.setLayoutParams(new LayoutParams(LayoutParams.WRAP_CONTENT,
LayoutParams.WRAP_CONTENT));
releaseImageResources();
speedo_meter = getImage(R.drawable.meter);
center_wheel = getImage(R.drawable.center_wheel);
needle = getImage(R.drawable.arrow);
paint_needle = new Paint();
paint_needle.setStyle(Paint.Style.FILL);
paint_needle.setAntiAlias(true);
}
And this is my layout XML with the custom view:
<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" >
<com.speedometer.view.SpeedometerView
android:id="@+id/speedometer_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginTop="40dip" >
</com.mobisoft.view.SpeedometerView>
<Button
android:id="@+id/change_needle_value_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:text="@string/move_needle" />
</RelativeLayout>
The relevant entries obtained via Log.d:
LANSCAPE MODE:
03-28 16:50:19.033: D/CANVAS HEIGHT :(2859): 487
03-28 16:50:19.033: D/CANVAS WIDTH :(2859): 1024
03-28 16:50:19.033: D/METER HEIGHT :(2859): 229
03-28 16:50:19.033: D/METER WIDTH :(2859): 209
03-28 16:50:19.033: D/NEEDLE HEIGHT :(2859): 59
03-28 16:50:19.033: D/NEEDLE WIDTH :(2859): 13
03-28 16:50:19.033: D/MATRIX :(2859): Matrix{[1.0, 0.0, 506.0][0.0, 1.0, 103.0][0.0, 0.0, 1.0]}
PORTRAIT MODE:
03-28 16:50:19.033: D/CANVAS HEIGHT :(2859): 911
03-28 16:50:19.033: D/CANVAS WIDTH :(2859): 600
03-28 16:50:19.033: D/METER HEIGHT :(2859): 229
03-28 16:50:19.033: D/METER WIDTH :(2859): 209
03-28 16:50:19.033: D/NEEDLE HEIGHT :(2859): 59
03-28 16:50:19.033: D/NEEDLE WIDTH :(2859): 13
03-28 16:50:19.033: D/MATRIX :(2859): Matrix{[1.0, 0.0, 294.0][0.0, 1.0, 244.0][0.0, 0.0, 1.0]}