Button Size mismatch Button Background Image Size - android

I have a question about the relationship between button size and button background image size.
Following is my code:
public class MyActivity extends Activity {
/**
* Called when the activity is first created.
*/
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
final Button button = (Button) findViewById(R.id.play);
button.setBackgroundResource(R.drawable.bg_start);
final String LOGTAG="TEST_LOG";
/* get image resource size */
BitmapFactory.Options options = new BitmapFactory.Options();
options.inJustDecodeBounds = true;
BitmapFactory.decodeResource(getResources(), R.drawable.bg_start, options);
/*get button size*/
ViewTreeObserver vto = button.getViewTreeObserver();
vto.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
#Override
public void onGlobalLayout() {
Log.i(LOGTAG, "button size=" + button.getWidth() +"," +button.getHeight());
}
});
Log.i(LOGTAG, "button play image resource size=" + resWidth + "," + resHeight);
}
}
My layout file:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#android:color/white"
>
<Button
android:id="#+id/play"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:background="#drawable/btn_play_bg"
/>
</RelativeLayout>
btn_play_bg file:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
</shape>
After I run the Activity I got output like this:
I/TEST_LOG﹕ button play image resource size=250,250
I/TEST_LOG﹕ button size=333,333
My question is why the button size doesn't equal to the image size. I thought they should be the same.

Related

setLayoutParams called from button OnClickListener

I'm trying to resize ImageView on button click. I don't know why but setLayoutParams works when I call it in onCreate method, but not working when use it inside button's OnClickListener. Did I miss something?
ImageView myImageView;
Button myButton;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_result);
myImageView = findViewById(R.id.viewtest);
myButton = (Button)findViewById(R.id.buttontest);
resizeImageView(); // resize when called here
myButton.setOnClickListener(new Button.OnClickListener() {
#Override
public void onClick(View v) {
resizeImageView(); // NOT resize when called here
}
});
}
private void resizeImageView() {
Toast.makeText(getApplicationContext(), "Resize", Toast.LENGTH_LONG).show();
LinearLayout.LayoutParams params = (LinearLayout.LayoutParams)myImageView.getLayoutParams();
params.height = 300;
params.width = 300;
myImageView.setLayoutParams(params);
}
XML layout. I'm using LinearLayout inside of RelativeLayout.
<?xml version="1.0" encoding="utf-8"?>
<android.widget.RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".ResultActivity">
<android.widget.LinearLayout
android:id="#+id/lineartest"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
>
<ImageView
android:id="#+id/viewtest"
android:layout_width="50dp"
android:layout_height="50dp"
android:scaleType="centerCrop"
android:layout_centerVertical="true"
app:srcCompat="#mipmap/ic_launcher_round"
android:background="#444"
/>
</android.widget.LinearLayout>
<android.support.v7.widget.AppCompatButton
android:id="#+id/buttontest"
android:layout_width="match_parent"
android:layout_height="100dp"
android:text="test"/>
</android.widget.RelativeLayout>
I just checked. This works fine in case of ImageView.
Maybe you are resizing it multiple times. Means If you have already called resresizeImageView() in onCreate method and you call it again in OnClick method , the resizing won't be visible because it already has the size you are resizing to.
In xml, you have AppCompatButton but in java you have defined as Button. Change AppCompatButton to Button in xml Or in java, Button to AppCompatButton.
I used your code, to create a new project, and just commented out the first call to resizeImageView() and it works fine when resizeImageView() is called in onClick()
As Derek answered, maybe you're already setting the same bounds to the ImageView during onCreate() which you wish to update in button click.
Also, just a suggestion:
Try adding the property android:layout_below="#id/lineartest" to your AppCompatButton.
Change android:layout_height="wrap_content", so you can view the changes happening to the ImageView.
Try this one
public class SomeActivity extends Activity {
public static final float screenWidth;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.the_company);
DisplayMetrics metrics = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(metrics);
screenWidth = metrics.widthPixels;
}
}
And after declare this implementation:
Button mButton = (Button) findViewById(R.id.button);
mButton.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
float scale = SomeActivity.screenWidth / view.getWidth();
if(view.getScaleX() == 1) {
view.setScaleY(scale);
view.setScaleX(scale);
} else{
view.setScaleY(1);
view.setScaleX(1);
}
}
});
OK. I've found solution. I use some async task that affects ImageView (loading image). When I disabled it resize button started to work as excepted. Thanks for your help.

ClipDrawable how to change the image

Im trying to implement a ClipDrawable appear by clicking with diferents images
I have this working with a simple image
Code:
MainActivity.java
ImageView imageview = (ImageView) findViewById(R.id.image);
drawable = (ClipDrawable) imageview.getDrawable();
drawable.setLevel(0);
imageview.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
drawable.setLevel(drawable.getLevel()+1000);
}
});
activity_main.xml
<ImageView
android:id="#+id/image"
android:src="#drawable/clip_source"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
clip_source.xml
<clip xmlns:android="http://schemas.android.com/apk/res/android"
android:drawable="#drawable/tree"
android:clipOrientation="vertical"
android:gravity="bottom"
/>
this is working but for my project I need to change the image displayed with a variable to display diferents images depending of the user input
I only find one way, using diferent files for each ClipDraw
MainActivity.java
if(aa == false){
t = (ClipDrawable) getResources().getDrawable(R.drawable.clip1);
}else{
t = (ClipDrawable) getResources().getDrawable(R.drawable.clip2);
}
setContentView(R.layout.activity_main);
ImageView imageview = (ImageView) findViewById(R.id.image);
imageview.setBackgroundDrawable(back);
imageview.setImageDrawable(t);
t.setLevel(0);
imageview.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
t.setLevel(t.getLevel()+1000);
}
});
activity_main.xml
<ImageView
android:id="#+id/image"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
clip1.xml
<?xml version="1.0" encoding="utf-8"?>
<clip xmlns:android="http://schemas.android.com/apk/res/android"
android:drawable="#drawable/farm"
android:clipOrientation="vertical"
android:gravity="bottom"
/>
clip2.xml
<?xml version="1.0" encoding="utf-8"?>
<clip xmlns:android="http://schemas.android.com/apk/res/android"
android:drawable="#drawable/werehouse"
android:clipOrientation="vertical"
android:gravity="bottom"
/>
this solve my problem but have the disadvantage of need one file for each image, and I will need at least 20

Android ImageView is not bring to front

android ImageView is not bringing to front in RelativeLayout
Tried to call bringtofront() didn't work
tried setting visibility to true didn't work
XML CODE
<?xml version="1.0" encoding="utf-8"?>
<!-- This file is /res/layout/main.xml -->
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/spellingLevel1Layout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal" >
<RelativeLayout
android:id="#+id/canvas_container"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/magnetboard" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="480dp"
android:layout_marginTop="600dp"
android:adjustViewBounds="true" />
</RelativeLayout>
</LinearLayout>
Java Code
public class spellingLevel1 extends Activity {
rel1 = (RelativeLayout) findViewById(R.id.canvas_container);
mImageView1 = (ImageView) findViewById(R.id.imageView1);
image1();
}
public void randomNumber() {
Random rando = new Random();
currentLetter = myImageList[rando.nextInt(myImageList.length)];
}
public void image1(){
//randomNumber();
mImageView1 = (ImageView) findViewById(R.id.imageView1);
mImageView1.setBackgroundResource(R.drawable.spelling_);
mImageView1.bringToFront();
mImageView1.requestLayout();
}
UPDATED CODE
rel1 = (RelativeLayout) findViewById(R.id.canvas_container);
mImageView1 = (ImageView) findViewById(R.id.imageView1);
image1();
}
public void randomNumber() {
Random rando = new Random();
currentLetter = myImageList[rando.nextInt(myImageList.length)];
}
public void image1(){
//randomNumber();
mImageView1 = (ImageView) findViewById(R.id.imageView1);
mImageView1.setImageResource(R.drawable.spelling_); //updated here to setImageResource
mImageView1.bringToFront();
Still does not show
its not the full code but it should be everything to help you see what is included in here
You should define the image source of the ImageView.
because it's size is set to wrap_content and it has no content, the size stays 0.

How to apply RGBA_8888 and dither correctly?

I have splash.png with gradient. But on screen this image looks not so good ...
My simple .apk for this question consists of:
public class TestditherActivity extends Activity {
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
}
#Override
public void onAttachedToWindow() {
super.onAttachedToWindow();
getWindow().setFormat(PixelFormat.RGBA_8888);
}
}
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/LinearLayout01"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center" >
<ImageView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:scaleType="fitXY"
android:src="#drawable/test"/>
</LinearLayout>
and test.xml:
<?xml version="1.0" encoding="utf-8"?>
<bitmap
xmlns:android="http://schemas.android.com/apk/res/android"
android:src="#drawable/splash"
android:antialias="true"
android:dither="true" />
splash.png
result
How to apply RGBA_8888 and dither correctly? Where is my mistake?
The next code gives me perfect result in emulator, but not on the real device:
public class TestditherActivity extends Activity {
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
getWindow().setFormat(PixelFormat.RGBA_8888);
getWindow().addFlags(WindowManager.LayoutParams.FLAG_DITHER);
BitmapFactory.Options options = new BitmapFactory.Options();
options.inPreferredConfig = Bitmap.Config.ARGB_8888;
Bitmap gradient = BitmapFactory.decodeResource(getResources(), R.drawable.splash, options);
findViewById(R.id.linear).setBackgroundDrawable(new BitmapDrawable(gradient));
}
}
main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/linear"
android:layout_width="fill_parent"
android:layout_height="fill_parent"/>
Take a look at this:
Awful background image quality in Android
Or this blog post about dithering in Android: http://android.amberfog.com/?p=247
In your case the problem is in the bitmap xml. I remember reading somewhere that the dither only works if the bitmap has a tileMode set.

Android: How to display an image file (building's floor map) and update the file?

I have read ImageView. I want to use it to display the image file. Also, I have plan to provide functionality to update the file.
Would you teach me on how to display the image file. Then add group of radio buttons on the top to represent the floors. When I click 1st Floor, the imageview source change to image1.png, then click 2nd floor radio button, change to image2.png and so on..
I am using Android Platform 2.1-update1 and eclipse ADT for this thesis.
Here's my current code: (although there is some undesirable appearance of the radio buttons)
public class DisplayImageMapActivity extends Activity {
ImageView iv;
private final String FLOOR = "F";
private final String storagePath = Environment.getExternalStorageDirectory() + "/keitaiAppH23";
private final String localMapsPath = storagePath + "/localMaps";
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
iv=(ImageView)findViewById(R.id.storageimage);
RadioGroup levelRGroup = (RadioGroup) findViewById(R.id.level_rgroup);
int levelSize = 8;
for (int i = 0; i < levelSize; i++) {
RadioButton levelRButton = new RadioButton(this);
if(i==0) {
levelRButton.setText(new StringBuffer(i+1).append(FLOOR).append("(start)"));
} else if (i==7) {
levelRButton.setText(new StringBuffer(i+1).append(FLOOR).append("(end)"));
}
levelRButton.setTag((i+1) + FLOOR);
levelRButton.setLayoutParams(
new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT, 1));
levelRGroup.addView(levelRButton);
}
levelRGroup.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
public void onCheckedChanged(RadioGroup group, final int checkedId) {
iv.setImageURI(Uri.parse(new StringBuffer(localMapsPath)
.append("/").append(group.findViewById(checkedId).getTag()).append(".gif").toString()));
iv.invalidate();
}
});
levelRGroup.getChildAt(0).performClick();
}
}
main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/main_layout"
>
<RadioGroup android:id="#+id/level_rgroup"
android:layout_width="wrap_content" android:orientation="horizontal"
android:layout_height="wrap_content">
</RadioGroup>
<ImageView android:id="#+id/storageimage" android:src="#drawable/icon"
android:layout_width="fill_parent" android:layout_height="wrap_content" />
</LinearLayout>
UPDATE:
Requirements:
image file are set dynamically which obtain from external source
(e.g. DB,url). - Resolved
radiobuttons are need to be dynamically created because it is not fix by 8F. It should be the number of target floors (e.g. start is 5F, end is 7F, so it should be 3 radiobuttons only 5F,6F,7F). - Resolved
Problems Encountered:
Image cannot be updated. - Resolved
All radiobuttons are not displayed as expected (Maybe due to wrong layout). - Not Yet Resolved
When I click the radiobuttons to toggle the selection, it doesn't change on the 1F radiobutton. Note: It is OK for 2F to 8F. It switches the selection as expected. - Resolved
Screen shot:
These modifications should do it (there may be some typos):
Layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/main_layout"
>
<ImageView android:layout_height="wrap_content" android:layout_width="fill_parent"
android:id="#+id/iView" android:src="#drawable/icon"></ImageView>
<RadioGroup android:id="#+id/level_rgroup"
android:layout_width="fill_parent" android:orientation="horizontal"
android:layout_height="wrap_content">
<RadioButton android:id="#+id/rb1"
android:width="106dip" android:height="80dip" android:text="Floor 1"/>
<RadioButton android:id="#+id/rb2"
android:width="106dip" android:height="80dip" android:text="Floor 2"/>
<RadioButton android:id="#+id/rb3"
android:width="106dip" android:height="80dip" android:text="Floor 3"/>
</RadioGroup>
</LinearLayout>
Code:
public class DisplayImageMapActivity extends Activity {
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
RadioGroup levelRGroup = (RadioGroup) mainLayout.findViewById(R.id.level_rgroup);
final ImageView iView = (ImageView) findViewById(R.id.iView);
levelRGroup.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
public void onCheckedChanged(RadioGroup group, final int checkedId) {
switch (checkedId) {
case R.id.rb1:
iView.setImageResource(R.drawable.floor_1);
iView.invalidate();
break;
case R.id.rbM2:
iView.setImageResource(R.drawable.floor_2);
iView.invalidate();
break;
case R.id.rb3:
iView.setImageResource(R.drawable.floor_3);
iView.invalidate();
break;
}
}
});
}
}
You can add those buttons programatically if you want to, remember to set layout_width and other attributes for them if you want them to be seen (I put them in the XML since I had that code laying around).
Comment if you have any questions.

Categories

Resources