Question

我在社交网络应用程序中工作，我的要求是从图库中获取图像并以马赛克风格显示。它类似于网格视图，但这里不同图像的大小彼此不同。我附上了一张图片来显示演示屏幕。 enter image description here

请为此建议我。

Answer 1

感谢Siddharth Lele的想法，所以我找到了这个解决方案。我正在粘贴结构化的代码。我在以一种格式安排它时遇到了一些问题，现在我认为其他人可以用这种紧张感来解决问题。请记住，代码仅适用于4.0及更高版本。

<强> activity_main.xml中

    <com.jake.quiltviewsample.QuiltView
        android:id="@+id/quilt"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:padding="5dip" >
    </com.jake.quiltviewsample.QuiltView>

</FrameLayout>

<强> MainActivity.java

public class MainActivity extends Activity {
    public QuiltView quiltView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        quiltView = (QuiltView) findViewById(R.id.quilt);
        quiltView.setChildPadding(5);
        addTestQuilts(200);
    }

    public void addTestQuilts(int num){
        ArrayList<ImageView> images = new ArrayList<ImageView>();
        for(int i = 0; i < num; i++){
            ImageView image = new ImageView(this.getApplicationContext());
            image.setScaleType(ScaleType.CENTER_CROP);
            if(i % 2 == 0)
                image.setImageResource(R.drawable.mayer);
            else 
                image.setImageResource(R.drawable.mayer1);
            images.add(image);
        }
        quiltView.addPatchImages(images);
    }

    }

<强> QuiltView.java

public class QuiltView extends FrameLayout implements OnGlobalLayoutListener {

    public QuiltViewBase quilt;
    public ViewGroup scroll;
    public int padding = 5;
    public boolean isVertical = false;
    public ArrayList<View> views;
    private Adapter adapter;

    public QuiltView(Context context,boolean isVertical) {
        super(context);
        this.isVertical = isVertical;
        setup();
    }

    public QuiltView(Context context, AttributeSet attrs) {
        super(context, attrs);
        TypedArray a = context.obtainStyledAttributes(attrs,
                R.styleable.QuiltView);

        String orientation = a.getString(R.styleable.QuiltView_scrollOrientation);
        if(orientation != null){
            if(orientation.equals("vertical")){
                isVertical = true;
            } else {
                isVertical = false;
            }
        }
        setup();
    }

    public void setup(){
        views = new ArrayList<View>();

        if(isVertical){
            scroll = new ScrollView(this.getContext());
        } else {
            scroll = new HorizontalScrollView(this.getContext());
        }
        quilt = new QuiltViewBase(getContext(), isVertical);
        scroll.addView(quilt);
        this.addView(scroll);

    }

    private DataSetObserver adapterObserver = new DataSetObserver(){
        public void onChanged(){
            super.onChanged();
            onDataChanged();
        }

        public void onInvalidated(){
            super.onInvalidated();
            onDataChanged();
        }

        public void onDataChanged(){
            setViewsFromAdapter(adapter);
        }
    };

    public void setAdapter(Adapter adapter){
        this.adapter = adapter;
        adapter.registerDataSetObserver(adapterObserver);
        setViewsFromAdapter(adapter);
    }

    private void setViewsFromAdapter(Adapter adapter) {
        this.removeAllViews();
        for(int i = 0; i < adapter.getCount(); i++){
            quilt.addPatch(adapter.getView(i, null, quilt));
        }
    }

    public void addPatchImages(ArrayList<ImageView> images){

        for(ImageView image: images){
            FrameLayout.LayoutParams params = new FrameLayout.LayoutParams(FrameLayout.LayoutParams.MATCH_PARENT, FrameLayout.LayoutParams.MATCH_PARENT);
            image.setLayoutParams(params);

            LinearLayout wrapper = new LinearLayout(this.getContext());
            wrapper.setPadding(padding, padding, padding, padding);
            wrapper.addView(image);
            quilt.addPatch(wrapper);
        }
    }

    public void addPatchViews(ArrayList<View> views_a){
        for(View view: views_a){
            quilt.addPatch(view);
        }
    }

    public void addPatchesOnLayout(){
        for(View view: views){
            quilt.addPatch(view);
        }
    }

    public void removeQuilt(View view){
        quilt.removeView(view);
    }

    public void setChildPadding(int padding){
        this.padding = padding;
    }

    public void refresh(){
        quilt.refresh();
    }

    public void setOrientation(boolean isVertical){
        this.isVertical = isVertical;
    }


    @Override
    public void onGlobalLayout() {
        //addPatchesOnLayout();
        }
    }

**QuiltViewBase.java**

    public class QuiltViewBase extends GridLayout {

        public int[] size;
        public int columns;
        public int rows;
        public int view_width = -1;
        public int view_height = -1;
        public boolean isVertical = true;
        public ArrayList<View> views;

        public QuiltViewBase(Context context, boolean isVertical) {
            super(context);
            this.isVertical = isVertical;
            if(view_width == -1){
                DisplayMetrics metrics = this.getResources().getDisplayMetrics();
                int width = metrics.widthPixels;
                int height = metrics.heightPixels - 120;
                view_width = width - this.getPaddingLeft() - this.getPaddingRight();
                view_height = height - this.getPaddingTop() - this.getPaddingBottom();
            }
            views = new ArrayList<View>();
            setup();
        }

        public void setup(){
            if(isVertical){
                setupVertical();
            } else {
                setupHorizontal();
            }
        }

        public void setupVertical(){
            size = getBaseSizeVertical();
            this.setColumnCount(columns);
            this.setRowCount(-1);
            this.setOrientation(this.HORIZONTAL);
            FrameLayout.LayoutParams params = new FrameLayout.LayoutParams(FrameLayout.LayoutParams.MATCH_PARENT, FrameLayout.LayoutParams.MATCH_PARENT);
            this.setLayoutParams(params);
        }

        public void setupHorizontal(){
            size = getBaseSizeHorizontal();
            this.setRowCount(rows);
            this.setColumnCount(-1);
            this.setOrientation(this.VERTICAL);
            FrameLayout.LayoutParams params = new FrameLayout.LayoutParams(FrameLayout.LayoutParams.MATCH_PARENT, FrameLayout.LayoutParams.MATCH_PARENT);
            this.setLayoutParams(params);
        }

        public void addPatch(View view){

            int count = this.getChildCount();

            QuiltViewPatch child = QuiltViewPatch.init(count, columns);

            GridLayout.LayoutParams params = new GridLayout.LayoutParams();
            params.width = size[0]*child.width_ratio;
            params.height = size[1]*child.height_ratio;
            params.rowSpec = GridLayout.spec(Integer.MIN_VALUE, child.height_ratio);
            params.columnSpec = GridLayout.spec(Integer.MIN_VALUE, child.width_ratio);
            view.setLayoutParams(params);
            addView(view);
            views.add(view);
        }

        public void refresh(){
            this.removeAllViewsInLayout();
            setup();
            for(View view : views){
                addPatch(view);
            }
        }

        public int[] getBaseSize(){
            int[] size = new int[2];

            float width_height_ratio = (3.0f/4.0f);

            int base_width = getBaseWidth();
            int base_height = (int) (base_width*width_height_ratio);

            size[0] = base_width; // width
            size[1] = base_height; // height
            return size;
        }

        public int[] getBaseSizeVertical(){
            int[] size = new int[2];

            float width_height_ratio = (3.0f/4.0f);

            int base_width = getBaseWidth();
            int base_height = (int) (base_width*width_height_ratio);

            size[0] = base_width; // width
            size[1] = base_height; // height
            return size;
        }

        public int[] getBaseSizeHorizontal(){
            int[] size = new int[2];

            float width_height_ratio = (4.0f/3.0f);

            int base_height = getBaseHeight();
            int base_width = (int) (base_height*width_height_ratio);

            size[0] = base_width; // width
            size[1] = base_height; // height
            return size;
        }

        public int getBaseWidth(){
            if(view_width < 500){
                columns = 2;
            } else if(view_width < 801){
                columns = 3;
            } else if(view_width < 1201){
                columns = 4;
            } else if(view_width < 1601){
                columns = 5;
            } else {
                columns = 6;
            }
            return (view_width / columns);
        }

        public int getBaseHeight(){
            if(view_height < 350){
                rows = 2;
            } else if(view_height < 650){
                rows = 3;
            } else if(view_height < 1050){
                rows = 4;
            } else if(view_height < 1250){
                rows = 5;
            } else {
                rows = 6;
            }
            return (view_height / rows);
        }

         /*@Override 
         protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec){
            int parentWidth = MeasureSpec.getSize(widthMeasureSpec);
            int parentHeight = MeasureSpec.getSize(heightMeasureSpec);
            super.onMeasure(widthMeasureSpec, heightMeasureSpec);

            view_width = parentWidth;
            view_height = parentHeight;

            setup(isVertical);
         }*/

        @Override
        protected void onSizeChanged(int xNew, int yNew, int xOld, int yOld){
                super.onSizeChanged(xNew, yNew, xOld, yOld);
                view_width = xNew;
                view_height = yNew;
        }


    }

**QuiltViewPatch.java**


public class QuiltViewPatch implements Comparable{
    public int width_ratio;
    public int height_ratio;

    public QuiltViewPatch(int width_ratio, int height_ratio){
        this.width_ratio = width_ratio;
        this.height_ratio = height_ratio;
    }

    private static QuiltViewPatch create(Size size){
        switch(size){
        case Big:
            return new QuiltViewPatch(2,2);
        case Small:
            return new QuiltViewPatch(1,1);
        case Tall:
            return new QuiltViewPatch(1,2);
        }

        return new QuiltViewPatch(1,1);
    }

    public int getHeightRatio(){return this.height_ratio;}
    public int getWidthRatio(){return this.width_ratio;}

    public static QuiltViewPatch create(int view_count){

        if(view_count == 0)
            return new QuiltViewPatch(2,2);
        else if((view_count % 11) == 0)
            return new QuiltViewPatch(2,2);
        else if((view_count % 4) == 0)
            return new QuiltViewPatch(1,2);
        else 
            return new QuiltViewPatch(1,1);

    }

    private enum Size{
        Big,
        Small,
        Tall
    }

    public static QuiltViewPatch init(int position, int column){
        switch(column){
        case 2:
            return init2(position);
        case 3:
            return init3(position);
        case 4:
            return init4(position);
        case 5:
            return init5(position);
        }

        return init3(position);
    }

    private static QuiltViewPatch init2(int position){
        switch(position % 15){
        case 0:
            return create(Size.Big);
        case 1:
        case 2:
        case 3:
            return create(Size.Small);
        case 4:
            return create(Size.Tall);
        case 5:
        case 6:
        case 7:
            return create(Size.Small);
        case 8:
            return create(Size.Tall);
        case 9:
            return create(Size.Tall);
        case 10:
            return create(Size.Small);
        case 11:
            return create(Size.Big);
        case 12:
            return create(Size.Tall);
        case 13:
            return create(Size.Tall);
        case 14:
            return create(Size.Small);
        }

        return create(Size.Small);
    }

    private static QuiltViewPatch init3(int position){
        switch(position % 32){
        case 0:
            return create(Size.Big);
        case 1:
        case 2:
        case 3:
            return create(Size.Small);
        case 4:
            return create(Size.Tall);
        case 5:
        case 6:
        case 7:
            return create(Size.Small);
        case 8:
            return create(Size.Tall);
        case 9:
        case 10:
            return create(Size.Small);
        case 11:
            return create(Size.Big);
        case 12:
            return create(Size.Tall);
        case 13:
        case 14:
            return create(Size.Small);
        case 15:
            return create(Size.Small);
        case 16:
            return create(Size.Tall);
        case 17:
        case 18:
        case 19:
            return create(Size.Small);
        case 20:
            return create(Size.Tall);
        case 21:
        case 22:
            return create(Size.Small);
        case 23:
            return create(Size.Big);
        case 24:
            return create(Size.Small);
        case 25:
            return create(Size.Tall);
        case 26:
        case 27:
        case 28:
            return create(Size.Small);
        case 29:
            return create(Size.Tall);
        case 30:
        case 31:
            return create(Size.Small);
        }

        return create(Size.Small);
    }

    private static QuiltViewPatch init4(int position){
        switch(position % 36){
        case 0:
            return create(Size.Big);
        case 1:
        case 2:
        case 3:
            return create(Size.Small);
        case 4:
            return create(Size.Tall);
        case 5:
        case 6:
        case 7:
            return create(Size.Small);
        case 8:
            return create(Size.Tall);
        case 9:
        case 10:
        case 11:
            return create(Size.Small);
        case 12:
            return create(Size.Big);
        case 13:
            return create(Size.Tall);
        case 14:
        case 15:
        case 16:
            return create(Size.Small);
        case 17:
            return create(Size.Tall);
        case 18:
        case 19:
        case 20:
            return create(Size.Small);
        case 21:
            return create(Size.Tall);
        case 22:
        case 23:
            return create(Size.Small);
        case 24:
            return create(Size.Small);
        case 25:
            return create(Size.Big);
        case 26:
            return create(Size.Small);
        case 27:
            return create(Size.Tall);
        case 28:
        case 29:
        case 30:
            return create(Size.Small);
        case 31:
            return create(Size.Tall);
        case 32:
        case 33:
        case 34:
        case 35:
            return create(Size.Small);
        }

        return create(Size.Small);
    }

    private static QuiltViewPatch init5(int position){
        switch(position % 35){
        case 0:
            return create(Size.Big);
        case 1:
        case 2:
        case 3:
            return create(Size.Small);
        case 4:
            return create(Size.Tall);
        case 5:
        case 6:
        case 7:
            return create(Size.Small);
        case 8:
            return create(Size.Tall);
        case 9:
        case 10:
        case 11:
            return create(Size.Small);
        case 12:
            return create(Size.Big);
        case 13:
            return create(Size.Tall);
        case 14:
        case 15:
        case 16:
            return create(Size.Small);
        case 17:
            return create(Size.Tall);
        case 18:
        case 19:
        case 20:
            return create(Size.Small);
        case 21:
            return create(Size.Tall);
        case 22:
        case 23:
        case 24:
            return create(Size.Small);
        case 25:
            return create(Size.Big);
        case 26:
            return create(Size.Small);
        case 27:
            return create(Size.Tall);
        case 28:
        case 29:
        case 30:
            return create(Size.Small);
        case 31:
            return create(Size.Tall);
        case 32:
            return create(Size.Big);
        case 33:
            return create(Size.Tall);
        case 34:
            return create(Size.Small);

        }

        return create(Size.Small);
    }

    public static boolean getRandomBoolean(){
        return (Math.random() < 0.5);
    }

    public boolean equals(Object obj){
        if(obj != null && obj instanceof QuiltViewPatch){
            QuiltViewPatch size = (QuiltViewPatch)obj;
            return size.height_ratio == this.height_ratio && size.width_ratio == this.width_ratio;
        }

        return false;
    }

    public int hashCode(){
        return height_ratio + 100 * width_ratio;
    }

    public String toString(){
        return "Patch: " + height_ratio +  " x " + width_ratio;
    }

    @Override
    public int compareTo(Object another) {
        if(another != null && another instanceof QuiltViewPatch){
            QuiltViewPatch size = (QuiltViewPatch)another;
            if(size.equals(this))
                return 0;

            if(this.height_ratio < size.height_ratio)
                return -1;
            else if(this.height_ratio > size.height_ratio)
                return 1;

            if(this.width_ratio < size.width_ratio)
                return -1;
            else
                return 1;
        }
        return -1;
    }
}

Answer 2

我一直在寻找如何做到这一点，但发现Google现在已经覆盖了RecyclerView和StaggeredGridLayoutManager。我建议先看看那里。

在Android中以马赛克风格显示来自画廊的图片？

2 个答案: