android layout; Resizing colums of images so they fit the screen
im trying to make my images fit nicely into screen without overlapping but no matter what i do i cannot get them to scale properly. I thought ImageView.ScaleType.CENTER_CROP would scale my images but probably im doing it all wrong. any help would be appreciated. (if you know simple function that will fix my problem then pls feel free to respond without reading my code which is mostly tutorial code anyways )
Here is what i got: main.xml file:
<?xml version="1.0" encoding="utf-8"?>
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/gridview"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:columnWidth="75dp"
android:numColumns="auto_fit"
android:verticalSpacing="0dp"
android:horizontalSpacing="1dp"
android:stretchMode="columnWidth"
android:gravity="center"
/>
This is my HelloGrid.java file:
package com.grid.example;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.Window;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.GridView;
import android.widget.Toast;
public class HelloGrid extends Activity {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE); //removes annoying title on top
setContentView(R.layout.main);
GridView gridview = (GridView) findViewById(R.id.gridview);
gridview.setAdapter(new ImageAdapter(this));
gridview.setOnItemClickListener(new OnItemClickListener() {
public void onItemClick(AdapterView<?> parent, View v, int position, long id) {
Toast.makeText(HelloGrid.this, "" + position, Toast.LENGTH_SHORT).show();
}
});
}
}
and this is my ImageAdapter.java file:
package com.grid.example;
import android.content.Context;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.GridView;
import android.widget.ImageView;
public class ImageAdapter extends BaseAdapter {
private Context myContext;
public ImageAdapter(Context c) {
myContext = c;
}
public int getCount() {
return mThumbIds.length;
}
public Object getItem(int position) {
return null;
}
public long getItemId(int position) {
return 0;
}
// create a new ImageView for each item referenced by the Adapter
public View getView(int position, View convertView, ViewGroup parent) {
ImageView imageView;
if (convertView == null) { // if it's not recycled, initialize some attributes
imageView = new ImageView(myContext);
imageView.setLayoutParams(new GridView.LayoutParams(85, 85));
imageView.setScaleType(ImageView.ScaleType开发者_StackOverflow中文版.CENTER_CROP);
imageView.setPadding(4, 0, 4, 0 );
} else {
imageView = (ImageView) convertView;
}
imageView.setImageResource(mThumbIds[position]);
return imageView;
}
// references to our images
private Integer[] mThumbIds = {
R.drawable.sample_0, R.drawable.sample_3,
R.drawable.sample_4, R.drawable.sample_5,
R.drawable.sample_6, R.drawable.sample_7,
R.drawable.sample_0, R.drawable.sample_1,
R.drawable.sample_2, R.drawable.sample_3,
R.drawable.sample_4, R.drawable.sample_5,
R.drawable.sample_6, R.drawable.sample_7,
R.drawable.sample_0, R.drawable.sample_1,
R.drawable.sample_2, R.drawable.sample_3,
R.drawable.sample_4, R.drawable.sample_5,
R.drawable.sample_6, R.drawable.sample_7,
R.drawable.sample_2, R.drawable.sample_3,
R.drawable.sample_4, R.drawable.sample_5,
R.drawable.sample_6, R.drawable.sample_7,
R.drawable.sample_0, R.drawable.sample_1,
R.drawable.sample_2, R.drawable.sample_3,
R.drawable.sample_4, R.drawable.sample_5,
R.drawable.sample_6, R.drawable.sample_7,
R.drawable.sample_0, R.drawable.sample_1,
R.drawable.sample_2, R.drawable.sample_3,
R.drawable.sample_4, R.drawable.sample_5,
R.drawable.sample_6, R.drawable.sample_7,
R.drawable.sample_2, R.drawable.sample_3,
R.drawable.sample_4, R.drawable.sample_5
};
}
I tried editing the padding and the horizontalspacing in the main.xml file. I got the vertical spacing to be just fine. I am just having problems with images to resize so they fit the screen perfectly.
once try this
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/gridview"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:columnWidth="90dp"
android:numColumns="auto_fit"
android:verticalSpacing="10dp"
android:horizontalSpacing="10dp"
android:stretchMode="columnWidth"
android:gravity="center"
/>
As Kaj has answered above, i am totally agree with him. Create a row layout file with ImageView only and then inflate the same layout in your ImageAdapter class.
The main advantage of this kind of row xml layout is to have preview of the layout.
And while creating ImageView, be sure you define android:scaleType="center"
so that it display in the center area.
An option to having a hardcoded "image layout" in your code is to create a new layout for your ImageView. You then inflate the layout in your code.
The benefit of that is that you can use the graphicla ui editor to see the properties, see a preview of how the ImageView behaves, and you make it easier to modify the behaviour without modifying the code. (You might e.g. want to have a different layout for other screen sizes)
Update: You can find an example of how to inflate a view here: API Demos, List14
Instead of trying to figure out the layout in android xml file i have downloaded AndEngine for android and it worked perfectly for ordering the images so they are right next to one another. It also allows for screen scrolling and is pretty good when it comes to game design. Here is the link if anybody else is interested.
http://andenginefromscratch.blogspot.com/2011/03/introduccion-andengine-parte-i.html
精彩评论