Изображение многослойного изображения

Ответ 1

Ваша идея в порядке. Вы используете dp как единицы размера, поэтому Views будет выглядеть аналогично на разных устройствах. Единственное, что я могу предложить в качестве улучшения - переместите все это для разделения класса View:

class ThumbView extends RelativeLayout {
    private ImageView vLayer1;
    private ImageView vLayer2;
    private ImageView vLayer3;

    public ThumbView(Context context, String pathToFile) {
        super(context);
        LayoutInflater inflater = (LayoutInflater) getContext()
          .getSystemService(Context.LAYOUT_INFLATER_SERVICE);

        View view = inflater.inflate(R.layout.view_thumb, this, true);
        vLayer1 = view.findViewById(R.id.view1);
        vLayer2 = view.findViewById(R.id.view2);
        vLayer3 = view.findViewById(R.id.view3);

        Drawable drawable = Drawable.createFromPath(pathToFile);

        vLayer1.setImageDrawable(drawable);
        vLayer2.setImageDrawable(drawable);
        vLayer3.setImageDrawable(drawable);
    }
}

Я предполагаю, что вы собираетесь использовать файлы из галереи для больших пальцев, поэтому добавлен путь к файлу для конструктора. Таким образом будет проще создавать эти представления из кода.

Другой подход, который вы можете использовать для этой цели, - это рисование Bitmaps непосредственно на Canvas. Этот способ может обеспечить некоторые преимущества производительности, если вы предполагаете создать большое количество таких представлений (чтобы показать их, например, в List/Grid). Пожалуйста, следуйте этому Guide для более подробной информации.

Ответ 2

Вы можете использовать это настраиваемое представление.

LayeredImageView.java

public class LayeredImageView extends RelativeLayout {
    private final int offset = 50;
    private int offsetMargin = offset;
    private int count = 0;
    private int imageHeight = 600;
    private int imageWidth = 600;
    private Context context;
    private Paint paint = new Paint();

    public LayeredImageView(Context context) {
        super(context);
        this.context = context;
        init();
    }

    private void init() {
        paint.setStyle(Paint.Style.STROKE);
        paint.setStrokeWidth(3);
        this.setWillNotDraw(false);
        paint.setColor(Color.WHITE);
    }

    public LayeredImageView(Context context, AttributeSet attrs) {
        super(context, attrs);
        this.context = context;
        init();
    }

    public LayeredImageView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        this.context = context;
        init();
    }

    public void addImage(int res) {
        count++;
        ImageView imageView = new ImageView(context);
        imageView.setImageDrawable(ContextCompat.getDrawable(context, res));
        RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(
                imageWidth,
                imageHeight);
        imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
        params.setMargins(offsetMargin, offsetMargin, 0, 0);
        imageView.setLayoutParams(params);
        this.addView(imageView);
        this.invalidate();
        offsetMargin += offset;
    }

    public void setImageHeight(int imageHeight) {
        this.imageHeight = imageHeight;
    }

    public void setImageWidth(int imageWidth) {
        this.imageWidth = imageWidth;
    }

    @Override
    public void onDrawForeground(Canvas canvas) {
        for (int o = offset, i = 0; i < count; o += offset, i++) {
            canvas.drawRect(o, o, imageWidth + o, imageHeight + o, paint);
        }
        super.onDrawForeground(canvas);
    }
}

В представлении содержатся некоторые жестко заданные значения, которые вы можете изменить в зависимости от ваших потребностей.

Затем в вашей активности или фрагменте раздуйте макет и динамически добавьте изображения

LayeredImageView view = (LayeredImageView) findViewById(R.id.view);
view.addImage(R.drawable.img_1);
view.addImage(R.drawable.img_2);
view.addImage(R.drawable.img_3);

ДЕМО

Ответ 3

Для перекрывающихся представлений FrameLayout - это точный контейнер, который вы должны использовать, поскольку он построен для этой цели. FrameLayout стекивает дочерние представления один на другой с последним добавленным вверху. z-index зависит от порядка дочерних просмотров. В приведенном ниже макете view3 будет выше view2, а view2 будет выше view1.

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <View
        android:id="@+id/view1"
        android:layout_width="150dp"
        android:layout_height="150dp"
        android:layout_marginTop="10dp"
        android:background="@drawable/images1">
    </View>
    <View
        android:id="@+id/view2"
        android:layout_width="150dp"
        android:layout_height="150dp"
        android:layout_marginTop="20dp"
        android:layout_marginLeft="10dp"
        android:background="@drawable/images1">
    </View>
    <View
        android:id="@+id/view3"
        android:layout_width="150dp"
        android:layout_height="150dp"
        android:layout_marginTop="30dp"
        android:layout_marginLeft="20dp"
        android:background="@drawable/images1">
    </View>

</FrameLayout>

Ответ 4

Используйте frame layout и используйте marginLeft и marginTop в порядке возрастания для каждого image view. Вы можете использовать библиотеку для предоставления маржинальных размеров, чтобы получить отзывчивый результат.

https://github.com/intuit/sdp

Вы можете даже добавить image views с разными полями к frame layout программно с помощью цикла. Это позволит вам добавить любое количество image views в соответствии с вашим входом.

Ответ 5

Просто скопируйте и подставьте ниже код FrameLayout специально разработан для этой цели ниже: Root Layout FrameLayout, затем

Изображение одно за другим

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">

<ImageView
    android:id="@+id/imageview1"
    android:layout_width="300dp"
    android:layout_height="300dp"
    android:layout_marginTop="10dp"
    android:background="@color/colorPrimary">
</ImageView>
<ImageView
    android:id="@+id/imageview2"
    android:layout_width="300dp"
    android:layout_height="300dp"
    android:layout_marginTop="20dp"
    android:layout_marginLeft="10dp"
    android:background="@color/colorPrimaryDark">
</ImageView>
<ImageView
    android:id="@+id/imageview3"
    android:layout_width="300dp"
    android:layout_height="300dp"
    android:layout_marginTop="30dp"
    android:layout_marginLeft="20dp"
    android:background="@color/colorAccent">
</ImageView> </FrameLayout>

попробуйте это и дайте мне знать, пожалуйста.

Ответ 6

используйте этот код...

View view = inflater.inflate(R.layout.view_thumb, this, true);
            viewLayer1 = view.findViewById(R.id.view1);
            viewLayer2 = view.findViewById(R.id.view2);
            viewLayer3 = view.findViewById(R.id.view3);
    Drawable drawable = Drawable.createFromPath(pathToFile);

            viewLayer1.setImageDrawable("@drawable/images1");
            viewLayer2.setImageDrawable("@drawable/images1");
            viewLayer3.setImageDrawable("@drawable/images1");

Ваша проблема должна быть решена.