gridview项之间的完美线性间距

时间:2014-01-13 10:01:39

标签: java android android-layout

我使用以下代码来显示GirdView项目。

<GridView
            android:id="@+id/gridView"
            android:gravity="center_horizontal"
            android:layout_below="@+id/searchLayout"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:horizontalSpacing="10dp"
            android:numColumns="3"
            android:stretchMode="columnWidth"
            android:verticalSpacing="10dp" />

每个GridItem(ImageView)的大小为92dp

我想要的是每行仅显示3列或3个图像,每个顶部,底部,左侧都需要完全对齐且相等。

以下是上述代码的结果。

enter image description here

可以看出,与图像之间的空间相比,网格左侧和右侧的空间非常小,而且行之间的空间非常小。

其次,我使用92dp。以上是S3的结果,但是当我使用小屏幕时,第三张图像不像320 dp屏幕那样合适。

不应该使用“dp”根据屏幕尺寸自动调整吗?

6 个答案:

答案 0 :(得分:0)

我认为此代码会对您有所帮助 试试吧: -

GridView
android:id="@+id/grid_view"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:numColumns="3"
android:gravity="center"
android:stretchMode="columnWidth"
android:background="#000000"/>

答案 1 :(得分:0)

在GridView的xml中

    <GridView 
        android:id                = "@+id/gridViewSms"
        android:layout_width      = "fill_parent"
        android:layout_height     = "fill_parent"
        android:numColumns        = "3"
        android:horizontalSpacing = "10dp"
        android:verticalSpacing   = "10dp"
        android:gravity           = "center"
        android:stretchMode       ="columnWidth">

ImageAdapter.java

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 mContext;
     private int widthOfScrren;
     public Integer[] mThumbIds;


        // Constructor
        public ImageAdapter(Context c,int ScrrenSize,Integer[] mThumbIds){
            mContext = c;
            widthOfScrren=ScrrenSize;
            this.mThumbIds = mThumbIds;
        }

        @Override
        public int getCount() {
            return mThumbIds.length;
        }

        @Override
        public Object getItem(int position) {
            return mThumbIds[position];
        }

        @Override
        public long getItemId(int position) {
            return 0;
        }


        @Override
        public View getView(int position, View convertView, ViewGroup parent) {
            ImageView imageView = new ImageView(mContext);
            imageView.setImageResource(mThumbIds[position]);
            imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);

            imageView.setLayoutParams(new GridView.LayoutParams(widthOfScrren / 4,widthOfScrren / 4));
            return imageView;
        }



}

在您的活动中

import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.view.Display;
import android.view.View;
import android.view.WindowManager;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.GridView;

public class MainActivity  extends Activity{


    private Integer[] mThumbIds = {
            R.drawable.image1 ,
            R.drawable.image2,
            R.drawable.image3,
            R.drawable.image4,
            R.drawable.image5,
            R.drawable.image6,
            R.drawable.image7,
            R.drawable.image8,
            R.drawable.image9
    };


    @SuppressWarnings("deprecation")
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        // TODO Auto-generated method stub
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);



        //found width of Screen for Gridview
        WindowManager windowManager = (WindowManager) getSystemService(Context.WINDOW_SERVICE);
        Display display = windowManager.getDefaultDisplay();
        int densityX = display.getWidth();



        GridView grid = (GridView) findViewById(R.id.gridViewSms);
        grid.setAdapter(new ImageAdapter(getApplicationContext(), densityX, mThumbIds));

        grid.setOnItemClickListener(new OnItemClickListener() {

            @Override
            public void onItemClick(AdapterView<?> parent, View v, int position ,
                    long id) {


            }
        });


    }

}

我测试了它。它有效。

答案 2 :(得分:0)

过去,我使用的是GridLayout而不是GridView,因此我可以保持与api v8的兼容性。

对于GridLayout,我写了一个漂亮的小函数,它放在活动中以动态拉伸/分隔网格中的项目以均匀地填充视图。我在这里写到:

https://stackoverflow.com/a/15341447/2066079

为方便起见,我还复制了以下代码:

public void fillview(android.support.v7.widget.GridLayout gl)
{
    Button buttontemp;

    //Stretch buttons
    int idealChildWidth = (int) ((gl.getWidth()-20*gl.getColumnCount())/gl.getColumnCount());
    for( int i=0; i< gl.getChildCount();i++)
    {
        buttontemp = (Button) gl.getChildAt(i);
        buttontemp.setWidth(idealChildWidth);
    }
}

(20代表内部和外部填充和边距。这可以更普遍地完成,但这更加清晰)

然后可以像这样调用:

    android.support.v7.widget.GridLayout gl = (android.support.v7.widget.GridLayout)findViewById(R.id.buttongrid);
    ViewTreeObserver vto = gl.getViewTreeObserver();
    vto.addOnGlobalLayoutListener(new OnGlobalLayoutListener() {@Override public void onGlobalLayout() 
    {

            android.support.v7.widget.GridLayout gl = (android.support.v7.widget.GridLayout) findViewById(R.id.buttongrid);
            fillview(gl);

            ViewTreeObserver obs = gl.getViewTreeObserver();
            obs.removeGlobalOnLayoutListener(this);
    }});

必须由观察者完成,因为我们需要在调用视图之前等待绘制视图。

答案 3 :(得分:0)

请尝试以下代码:

Grid.xml:

<GridView
        android:id="@+id/photo_grid"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_margin="10dp"
        android:numColumns="3" />

照片的自定义xml文件:

<ImageView
        android:id="@+id/img_photo"
        android:layout_width="@dimen/grid_photo"
        android:layout_height="@dimen/grid_photo"
        android:scaleType="fitXY"
        android:layout_margin="5dp"
        android:src="@drawable/ic_launcher" />

注意:这里我建议使用不同尺寸的图像尺寸而不是固定的92dp。因此,通过使用dimens.xml,您可以获得不同分辨率的精确宽度和高度,并且Gridview中所有方面都具有相同的空间。

答案 4 :(得分:0)

  

我很久以前就遇到过同样的问题&amp;得到解决   这样:

您可以执行以下更改属性 gridview的:

<GridView
        android:id="@+id/gridView1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true"
        android:layout_below="@+id/rltop"
        android:fadingEdge="none"
        android:fitsSystemWindows="true"
        android:gravity="center"
        android:horizontalSpacing="10dp"
        android:numColumns="3"
        android:paddingLeft="10dp"
        android:paddingRight="10dp"
        android:soundEffectsEnabled="true"
        android:stretchMode="columnWidth"
        android:verticalSpacing="10dp" >
    </GridView>

获取您的屏幕尺寸&amp;宽度:

Display  display= ((WindowManager) getSystemService(Context.WINDOW_SERVICE)).getDefaultDisplay();
        myapp.screen_width = display.getWidth(); 
        myapp.screen_height = display.getHeight();
  

最重要的事情:

在您的GridAdapter类中 - &gt;在getView()方法中:

调用 方法以定位具有不同分辨率的设备:

    public void screenResolutions(int screen_width,int screen_height, RelativeLayout relativeLayout)
         {
            if((myapp.screen_width == 240)&&(myapp.screen_height==320))
            {
    //          relativeLayout.getLayoutParams().height=(myapp.screen_height-(35+General.getStatusBarHeight(cntxt)))/3;
                relativeLayout.getLayoutParams().width=(myapp.screen_width)/3;
            }
            else if((myapp.screen_width== 720)&&(myapp.screen_height==1280))
            {
      //        relativeLayout.getLayoutParams().height=(myapp.screen_height-(107+General.getStatusBarHeight(cntxt)))/3;
                relativeLayout.getLayoutParams().width=(myapp.screen_width)/3;


            }
            else if((myapp.screen_width== 320)&&(myapp.screen_height==480))
            {
  //            relativeLayout.getLayoutParams().height=(myapp.screen_height-(47+General.getStatusBarHeight(cntxt)))/3;
                relativeLayout.getLayoutParams().width=(myapp.screen_width)/3;


            }
            else if((myapp.screen_width == 480)&&(myapp.screen_height==800))
            {
//              relativeLayout.getLayoutParams().height=(myapp.screen_height-(71+General.getStatusBarHeight(cntxt)))/3;
                relativeLayout.getLayoutParams().width=(myapp.screen_width)/3;


            }
            else if((myapp.screen_width == 768)||(myapp.screen_height==1280))
            {
  //            relativeLayout.getLayoutParams().height=(myapp.screen_height-(114+General.getStatusBarHeight(cntxt)))/3;
                relativeLayout.getLayoutParams().width=(myapp.screen_width)/3;


            }
            else if((myapp.screen_width == 540)&&(myapp.screen_height==960))
            {
    //          relativeLayout.getLayoutParams().height=(myapp.screen_height-(80+General.getStatusBarHeight(cntxt)))/3;
                relativeLayout.getLayoutParams().width=(myapp.screen_width)/3;


            }
            else if((myapp.screen_width == 1080)||(myapp.screen_height==1920))
            {
   //           relativeLayout.getLayoutParams().height=(myapp.screen_height-(160+General.getStatusBarHeight(cntxt)))/3;
                relativeLayout.getLayoutParams().width=(myapp.screen_width)/3;


            }
         }

其中relativelayout =包含ImageView的布局。

  

你还需要改变身高和高度。 imageview到目标的宽度   多种分辨率如下:

将它放在你的imageview中:

    android:layout_width="@dimen/image_width"
    android:layout_height="@dimen/image_height"

把这个:

在值文件夹值-hdpi =&gt; dimens.xml(480×800)

<dimen name="image_width">92dp</dimen>
<dimen name="image_height">92dp</dimen>

在值文件夹值-mdpi =&gt; dimens.xml(480)

<dimen name="image_width">64dp</dimen>
<dimen name="image_height">64dp</dimen>

在值文件夹值-sw360dp-notlong-hdpi =&gt; dimens.xml(540x960)

<dimen name="image_width">114dp</dimen>
<dimen name="image_height">114dp</dimen>

在值文件夹值-sw360dp-xhdpi =&gt; dimens.xml(720x1280)

<dimen name="image_width">138dp</dimen>
<dimen name="image_height">138dp</dimen>

在值文件夹值-sw360dp-notlong-xhdpi =&gt; dimens.xml(768x1280)

<dimen name="image_width">184dp</dimen>
<dimen name="image_height">184dp</dimen>

答案 5 :(得分:0)

您是否尝试过Developer site给出的默认演示?

此演示清晰显示所有图像的高度和宽度相等,周围空间相等。

请同时查看Example for GridView

如果它没有帮助你,请告诉我。

享受编码......:)