在水平行android中显示图像

时间:2018-02-28 09:05:50

标签: android xml

我正在尝试在水平行中显示图像。出现图像但仅显示三个图像而不是五个图像。以下是我的摘录。

<LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="?android:attr/selectableItemBackground"
            android:clickable="true"
            android:orientation="horizontal"
            android:paddingLeft="32dp"
            android:paddingRight="32dp">

            <ImageView
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:layout_margin="2dp"
                android:src="@drawable/star" />

            <ImageView
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:layout_margin="2dp"
                android:src="@drawable/star" />
            <ImageView
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:layout_margin="2dp"
                android:src="@drawable/star" />
            <ImageView
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:layout_margin="2dp"
                android:src="@drawable/star" />
            <ImageView
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:layout_margin="2dp"
                android:src="@drawable/star" />


        </LinearLayout>

请如何使图像水平显示,如果宽度已满,则让流向下一行

6 个答案:

答案 0 :(得分:0)

您可以使用下面的Horizo​​ntalScrollView

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:orientation="vertical">

    <HorizontalScrollView
        android:layout_width="match_parent"
        android:layout_height="wrap_content" >
        <LinearLayout
            android:id="@+id/mygallery"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="horizontal" >

            <ImageView
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:layout_margin="2dp"
                android:src="@drawable/tiles" />

            <ImageView
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:layout_margin="2dp"
                android:src="@drawable/ic_noti" />
            <ImageView
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:layout_margin="2dp"
                android:src="@drawable/tiles" />
            <ImageView
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:layout_margin="2dp"
                android:src="@drawable/tiles" />
            <ImageView
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:layout_margin="2dp"
                android:src="@drawable/tiles" />
        </LinearLayout>
    </HorizontalScrollView>

</LinearLayout>

这里输出

enter image description here

答案 1 :(得分:0)

使用Horizo​​ntalScrollView,

  <HorizontalScrollView
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
    <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="?android:attr/selectableItemBackground"
            android:clickable="true"
            android:orientation="horizontal"
            android:paddingLeft="32dp"
            android:paddingRight="32dp">

            <ImageView
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:layout_margin="2dp"
                android:src="@drawable/star" />

            <ImageView
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:layout_margin="2dp"
                android:src="@drawable/star" />
            <ImageView
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:layout_margin="2dp"
                android:src="@drawable/star" />
            <ImageView
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:layout_margin="2dp"
                android:src="@drawable/star" />
            <ImageView
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:layout_margin="2dp"
                android:src="@drawable/star" />


        </LinearLayout>
      </HorizontalScrollView>

答案 2 :(得分:0)

  

您应该使用recyclerView 因为您不想在内存中绘制所有imageView小部件 ..但是对于您的代码段...您可以使用此..

 <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:background="?android:attr/selectableItemBackground"
                android:clickable="true"
                android:orientation="horizontal"
                android:paddingLeft="32dp"
                android:paddingRight="32dp">

                <ImageView
                    android:layout_width="0dp"
                    android:layout_weight="1"
                    android:layout_height="100dp"
                    android:layout_margin="2dp"
                    android:src="@drawable/star" />

                <ImageView
                    android:layout_width="0dp"
                    android:layout_weight="1"
                    android:layout_height="100dp"
                    android:layout_margin="2dp"
                    android:src="@drawable/star" />
                <ImageView
                    android:layout_width="0dp"
                    android:layout_weight="1"
                    android:layout_height="100dp"
                    android:layout_margin="2dp"
                    android:src="@drawable/star" />
                <ImageView
                    android:layout_width="0dp"
                    android:layout_weight="1"
                    android:layout_height="100dp"
                    android:layout_margin="2dp"
                    android:src="@drawable/star" />
                <ImageView
                    android:layout_width="0dp"
                    android:layout_weight="1"
                    android:layout_height="100dp"
                    android:layout_margin="2dp"
                    android:src="@drawable/star" />

        </LinearLayout>

答案 3 :(得分:0)

<android.support.v7.widget.RecyclerView
                    android:id="@+id/recyclerViewFrame"
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:gravity="center" />


private RecyclerView recyclerViewFrame;
recyclerViewFrame = findViewById(R.id.recyclerViewFrame);
private LinearLayoutManager inearLayoutManagerFrame;
inearLayoutManagerFrame = new LinearLayoutManager(this, LinearLayoutManager.HORIZONTAL, false);
recyclerViewFrame.setLayoutManager(linearLayoutManagerFrame);


FramesAdapter frameAdapter = new FramesAdapter(activity, frameSelectedListner);
recyclerViewFrame.setAdapter(frameAdapter);






public class FramesAdapter extends RecyclerView.Adapter<FramesAdapter.ViewHolder> {
    @SuppressLint("StaticFieldLeak")
    public static ImageView mCurrentFilterBtn;
    private static int filterBtnId;
    private final Context context;
    private final FrameSelectedListner frameSelectedListner;
    private int lastPosition;
    private final DisplayImageOptions options;

    public FramesAdapter(Context context, FrameSelectedListner frameSelectedListner) {
        this.context = context;
        this.frameSelectedListner = frameSelectedListner;
        options = new DisplayImageOptions.Builder()
                .showImageOnLoading(R.drawable.no_image)
                .showImageForEmptyUri(R.drawable.no_image)
                .showImageOnFail(R.drawable.no_image)
                .cacheInMemory(true)
                .cacheOnDisk(true)
                .considerExifParams(true)
                .bitmapConfig(Bitmap.Config.ARGB_8888)
                .build();
    }

    public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        return new ViewHolder(LayoutInflater.from(this.context).inflate(R.layout.frames_adapter_item, parent, false));
    }

    public void onBindViewHolder(final ViewHolder holder, @SuppressLint("RecyclerView") int position) {



        holder.imageView.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {

                Bitmap bitmapFlag = null;
                try {
                    bitmapFlag = ImageLoader.getInstance().loadImageSync(SERVER_BASE_URL + serverData.getFrDetail().get(holder.getAdapterPosition()));
                } catch (OutOfMemoryError memoryError) {
                    memoryError.printStackTrace();
                } catch (Exception e) {
                    e.printStackTrace();
                }

                if (bitmapFlag != null) {
                    if (mCurrentFilterBtn != null)
                        mCurrentFilterBtn.setBackground(context.getResources().getDrawable(R.drawable.stroke_invisible));
                    filterBtnId = view.getId();
                    mCurrentFilterBtn = view.findViewById(filterBtnId);
                    mCurrentFilterBtn.setBackground(context.getResources().getDrawable(R.drawable.frame_stroke_visible));
                }

                frameSelectedListner.onFrameSelected(holder.getAdapterPosition());

            }
        });

        // bind data here
        try {

            String frame_path = SERVER_BASE_URL + serverData.getFrDetail().get(holder.getAdapterPosition());
            ImageLoader.getInstance()
                    .displayImage(frame_path, holder.imageView, options, new SimpleImageLoadingListener() {
                        @Override
                        public void onLoadingStarted(String imageUri, View view) {
                            holder.progress_bar.setVisibility(View.VISIBLE);
                        }

                        @Override
                        public void onLoadingFailed(String imageUri, View view, FailReason failReason) {
                            holder.progress_bar.setVisibility(View.GONE);
                        }

                        @Override
                        public void onLoadingComplete(String imageUri, View view, Bitmap loadedImage) {
                            holder.progress_bar.setVisibility(View.GONE);
                        }
                    }, new ImageLoadingProgressListener() {
                        @Override
                        public void onProgressUpdate(String imageUri, View view, int current, int total) {
                        }
                    }, true);

        } catch (OutOfMemoryError ignored) {
        } catch (Exception e) {
            e.printStackTrace();
        }


    }

    public int getItemCount() {

        return serverData.getFrDetail().size();

    }

    class ViewHolder extends RecyclerView.ViewHolder {
        final ImageView imageView;
        final ProgressBar progress_bar;

        ViewHolder(View itemView) {
            super(itemView);
            this.imageView = itemView.findViewById(R.id.imageView);
            this.progress_bar = itemView.findViewById(R.id.progress_bar);
        }
    }

    public interface FrameSelectedListner {
        void onFrameSelected(int position);
    }
}

frames_adapter_item.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="@dimen/_40sdp"
    android:layout_height="@dimen/_40sdp"
    android:background="@drawable/stroke_invisible"
    android:layout_marginLeft="@dimen/_2sdp"
    android:layout_marginRight="@dimen/_2sdp"
    android:gravity="center"
    android:orientation="vertical">

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:adjustViewBounds="true"
        android:contentDescription="@string/todo"
        android:padding="@dimen/_2sdp"
        android:scaleType="fitXY"
        tools:ignore="ContentDescription" />

    <ProgressBar
        android:id="@+id/progress_bar"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true" />
</RelativeLayout>

答案 4 :(得分:0)

使用Recyclerview并设置LayoutManager,如下所示

mRecyclerView.setLayoutManager(new LinearLayoutManager(this, LinearLayoutManager.HORIZONTAL, true));

它将为Viewroll提供Horizo​​ntal Scroll和Adapter以加载图像。

答案 5 :(得分:0)

Uncaught TypeError: Cannot read property 'height' of undefined

希望这会起作用&amp;让我知道它是否有效?如果工作,请给予正面投票。