Android ldpi-layout looks different on 2 different ldpi-devices (X10 Mini and FlipOut)
My problem is that the result of a layout looks different on the x10 mini and the flipout.
the result looks like this:
The left one is the result from X10 mini and the right one from Motorola Flipout. Unfortunatly I don't have another ldpi device to check which is the "right" one.
Here are the problems and what I tried so far:
1. The size of the text bubble aren't the same. but they both use the same bitmap (I write ldpi on the bitmap to be sure). The main problem seems to be that the density of the X10 mini is pretty high for an small device. The X10 mini has 156dpi (mdpi=160) and the flipout has 120dpi. This app has admob integrated and the size of the banner are different as well. On the X10 mini it looks nice on the FlipOut it's much bigger. It loads the size for mdpi devices. (I have just mention it because it might help to solve this problem.) I named the drawable folder "drawable-ldpi".
2.
The first avatar is smaller, sharp and clear, because I set the bitmap density to DENSITIY_MEDIUM. bitmap.setDensity(DisplayMetrics.DENSITY_MEDIUM);
If I set it to DENSITY_LOW it looks like the other bitmaps. And the width and height aren't 40px (like I scaled it to)
Here is the code:
layout xml file:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@color/orange"
android:paddingTop="15dp"
>
<!-- Content -->
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<!-- Text Bubble -->
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_gravity="center"
android:layout_weight="1"
android:paddingLeft="15dp"
android:paddingRight="15dp"
>
<TextView
android:id="@+id/text_avater"
style="@style/bubble_normal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="@string/avatar"
/>
</FrameLayout>
<!-- Avatar -->
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center" android:layout_weight="0.5">
<!-- Avatar 1st row -->
<LinearLayout
android:orientation="horizontal"
android:layout_weight="1"
android:gravity="center" android:layout_width="match_parent" android:layout_height="wrap_content">
<FrameLayout
android:layout_weight="1" android:layout_width="wrap_content" android:layout_height="wrap_content">
<Button
android:id="@+id/button_avater1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="@drawable/avatar1"
/>
</FrameLayout>
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
>
<Button
android:id="@+id/button_avater2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="@drawable/avatar2"
/>
</FrameLayout>
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
>
<Button
android:id="@+id/button_avater3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="@drawable/avatar3"
/>
</FrameLayout>
</LinearLayout>
<!-- /Avatar 1st row -->
<!-- Avatar 2nd row -->
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
>
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
>
<Button
android:id="@+id/button_avater4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="@drawable/avatar0"
/>
</FrameLayout>
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
>
<Button
android:id="@+id/button_avater5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="@drawable/avatar0"
/>
</FrameLayout>
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
>
<Button
android:id="@+id/button_avater6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="@drawable/avatar0"
/>
</FrameLayout>
</LinearLayout>
<!-- /Avatar 2nd row -->
<!-- Avatar 3rd row -->
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
>
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
>
<Button
android:id="@+id/button_avater7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="@drawable/avatar0"
/>
</FrameLayout>
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
>
<Button
android:id="@+id/button_avater8"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="@drawable/avatar0"
/>
</FrameLayout>
</LinearLayout>
<!-- /Avatar 3rdst row -->
</LinearLayout>
<!-- /Avatar -->
<!-- Button -->
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1.15"
android:gravity="center"
>
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
>
<Button
android:id="@+id/button_mainmenu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center|bottom"
android:layout_weight="1"
android:text="@string/mainmenu"
style="@style/button_small"
/>
</FrameLayout>
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
>
<Button
android:id="@+id/button_done"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center|bottom"
android:layout_weight="1"
android:text="@string/done"
style="@style/button_small"
/>
</FrameLayout>
</LinearLayout>
<!-- /Button -->
</LinearLayout>
<!-- /Content -->
</RelativeLayout>
the style looks like this:
<style name="bubble_normal">
<item name="android:gravity">center</item>
<item name="android:textColor">@color/black</item>
<item name="android:textStyle">bold</item>
<item name="android:background">@drawable/text_bubble_normal</item>
<item name="android:textSize">@dimen/standard_text_size</item>
</style>
The size of the bitmap is 210 x 93.
The avatar bitmaps I am loading programmatically:
private void setupView() {
byte numberOfPlayer = (byte) StbApp.getPlayer().size();
int avatarSize = Player.avatarSize;
Log.d(TAG, "avatarSize: " + avatarSize); // avatarSize: 40px
Bitmap bitmap = Bitmap.createScaledBitmap(
StbApp.getPlayer().get(0).getAvatar(),
avatarSize,
avatarSize,
true
);
bitmap.setDensity(DisplayMetrics.DENSITY_MEDIUM);
BitmapDrawable bitmapDrawable = new BitmapDrawable(
bitmap
);
avatarBtn[0] = (Button) findViewById(R.id.button_avater1);
avatarBtn[0].setBackgroundDrawable(bitmapDrawable);
avatarBtn[0].setOnClickListener(this);
bitmapDrawable = new BitmapDrawable(
Bitmap.createScaledBitmap(
StbApp.getPlayer().get(1).getAvatar(),
avatarSize,
avatarSize,
true
)
);
avatarBtn[1] = (Button) findViewById(R.id.button_avater2);
avatarBtn[1].setBackgroundDrawable(bitmapDrawable);
avatarBtn[1].setOnClickListener(this);
bitmapDrawable = new BitmapDrawable(
Bitmap.createScaledBitmap(
StbApp.getPlayer().get(2).getAvatar(),
avatarSize,
avatarSize,
true
)
);
avatarBtn[2] = (Button) findViewById(R.id.button_avater3);
avatarBtn[2].setBackgroundDrawable(bitmapDrawable);
avatarBtn[2].setOnClickListener(this);
avatarBtn[3] = (Button) findViewById(R.id.button_avater4);
avatarBtn[3].setOnClickListener(this);
avatarBtn[4] = (Button) findViewById(R.id.button_avater5);
avatarBtn[4].setOnClickListener(this);
avatarBtn[5] = (Button) findViewById(R.id.button_avater6);
avatarBtn[5].setOnClickListener(this);
avatarBtn[6] = (Button) findViewById(R.id.button_avater7);
avatarBtn[6].setOnClickListener(this);
avatarBtn[7] = (Button) findViewById(R.id.button_avater8);
avatarBtn[7].setOnCli开发者_JS百科ckListener(this);
mainMenuBtn = (Button) findViewById(R.id.button_mainmenu);
mainMenuBtn.setOnClickListener(this);
doneBtn = (Button) findViewById(R.id.button_done);
doneBtn.setOnClickListener(this);
//prepare avatar_0 if needed
if (numberOfPlayer < 8){
Bitmap avatarNull = BitmapFactory.decodeResource(getResources(), R.drawable.avatar0);
avatarNull = Player.strokeBitmap(avatarNull);
avatarNull = Bitmap.createScaledBitmap(
avatarNull,
avatarSize,
avatarSize,
true
);
for (byte i = 3; i < 8; i++){
if (i < numberOfPlayer){
bitmapDrawable = new BitmapDrawable(
Bitmap.createScaledBitmap(StbApp.getPlayer().get(i).getAvatar(),
avatarSize,
avatarSize,
true)
);
}
else{
bitmapDrawable = new BitmapDrawable(avatarNull);
}
avatarBtn[i].setBackgroundDrawable(bitmapDrawable);
}
}
//8 player no avatar0 needed
else{
for (byte i = 3; i < numberOfPlayer; i++){
bitmapDrawable = new BitmapDrawable(StbApp.getPlayer().get(i).getAvatar());
avatarBtn[i].setBackgroundDrawable(bitmapDrawable);
}
}
}
After converting a Bitmap
to BitmapDrawable
I have to set the targetDensitiy with BitmapDrawable.setTargetDensity(dpi);
I did it this way:
metrics = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(metrics);
tempAvatarBitmap = BitmapFactory.decodeStream(fis, null, opt);
tempAvatarBitmap = Bitmap.createScaledBitmap(
StbApp.getPlayer().get(requestCode-1).getAvatar(),
Player.avatarSize,
Player.avatarSize,
true
);
BitmapDrawable drawable = new BitmapDrawable(tempAvatarBitmap);
drawable.setTargetDensity(metrics.densityDpi);
精彩评论