Android Studio：在 Recycler 视图内绘制右上角丝带和星形框架布局

Question

我创建了一个回收站视图，如下所示：

My Recyclerview Row Layout

如何绘制带有或不带有图像的右上角圆角和右下角星号的圆角边框图像。图片由来自后端的 url 加载。

这是我的回收站视图行布局代码：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/rlMain"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="wrap_content"
    >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:layout_marginBottom="10dp"
        android:orientation="vertical">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            >

            <FrameLayout
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:layout_gravity="left"
                android:gravity="left"
                android:background="@drawable/ic_no_image"
                android:layout_margin="10dp"
                >


                <ImageView
                    android:id="@+id/convenzionato"
                    android:elevation="10dp"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:src="@drawable/convenzioni_ribbon"
                    android:visibility="visible"
                    />


                <ImageView
                    android:id="@+id/highlight"
                    android:elevation="10dp"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:src="@drawable/highlight"
                    android:visibility="visible"
                    />

                <ImageView
                    android:id="@+id/image"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:scaleType="fitXY"
                    app:srcCompat="@drawable/ic_no_image">

                </ImageView>



            </FrameLayout>

            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_gravity="right"
                android:gravity="right"
                android:layout_height="wrap_content">

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:orientation="vertical">

                    <TextView
                        android:id="@+id/nome"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:textColor="@color/bluPrincipale"
                        android:layout_marginTop="6dp"
                        android:text="Nome Evento"
                        android:textSize="20sp"
                        android:textStyle="bold" />

                    <TextView
                        android:id="@+id/tipologia"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:textColor="@color/oro"
                        android:text="Sagra"
                        android:textSize="12sp"
                        android:textStyle="bold" />

                    <LinearLayout
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:orientation="horizontal">

                        <TextView
                            android:id="@+id/localita"
                            android:layout_gravity="left"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:textColor="@color/grigioTipo1"
                            android:text="Città (PV)"
                            android:textSize="12sp"
                            android:textStyle="italic" />

                        <RelativeLayout
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_gravity="right">

                        <TextView
                            android:id="@+id/kmposizione"
                            android:layout_gravity="right"
                            android:layout_width="fill_parent"
                            android:layout_height="wrap_content"
                            android:textColor="@color/grigioTipo1"
                            android:paddingRight="10dp"
                            android:drawableRight="@drawable/icona_mappa_lista"
                            android:drawablePadding="5dp"
                            android:drawableTint="@color/bluPrincipale"
                            android:textAlignment="textEnd"
                            android:text="18 km"
                            android:textSize="12sp"
                            android:textStyle="italic"
                            tools:ignore="RtlCompat" />

                        </RelativeLayout>


                    </LinearLayout>

                    <TextView
                        android:id="@+id/data"
                        android:layout_gravity="left"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:textColor="@color/grigioTipo1"
                        android:drawableTint="@color/bluPrincipale"
                        android:text="Dal 01/01/2019"
                        android:textSize="12sp"
                        android:textStyle="italic" />

                    <TextView
                        android:id="@+id/descrizione"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:text="@string/latino"
                        android:layout_marginBottom="10dp"
                        />

                </LinearLayout>




            </RelativeLayout>






        </LinearLayout>

    </LinearLayout>

</RelativeLayout>

和使用这个的 RecycerViewAdapter：

package it.colan.xxx.adapters;

import android.app.Activity;
import android.content.Context;
import android.content.Intent;
import android.graphics.Matrix;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.RelativeLayout;
import android.widget.TextView;

import androidx.recyclerview.widget.RecyclerView;

import com.squareup.picasso.Picasso;

import java.util.ArrayList;
import java.util.List;

import it.colan.xxx.Config;
import it.colan.xxx.GUI.CustomAlertDialog;
import it.colan.xxx.GUI.GeneralUtil;
import it.colan.xxx.GUI.RoundedTransformation;
import it.colan.xxx.R;
import it.colan.xxx.activities.DettaglioCosaFareActivity;
import it.colan.xxx.models.CosaFare;

public class CosaFareAdapter extends RecyclerView.Adapter<CosaFareAdapter.ViewHolder> {
    private List<CosaFare> mValues = new ArrayList<>();
    private Context mContext;

    private CustomAlertDialog customAlertDialog;

    public CosaFare getValueAt(int position) {
        return mValues.get(position);
    }

    public CosaFareAdapter(Context context) {
        mContext = context;
        mValues = new ArrayList<>();

        customAlertDialog = new CustomAlertDialog((Activity) context);
    }

    @Override
    public CosaFareAdapter.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View view = LayoutInflater.from(mContext).inflate(R.layout.row_cosa_fare, parent, false);
        return new CosaFareAdapter.ViewHolder(view);
    }

    @Override
    public void onBindViewHolder(final CosaFareAdapter.ViewHolder holder, final int position) {

        final CosaFare item = getValueAt(position);


       Picasso.get()
                .load(Config.IMAGE_UPLOADED_BACKEND +  item.getFoto())
                .placeholder(R.drawable.ic_no_image)
               .resize(150,150)

                .into(holder.image);



       // .transform(new RoundedTransformation(10,0))

        holder.nome.setText(GeneralUtil.removeLinesSpaces(item.getTitolo()));
        holder.localita.setText(GeneralUtil.removeLinesSpaces(item.getLocalita()) + "(" + GeneralUtil.removeLinesSpaces(item.getProvincia()) + ")");
        holder.tipologia.setText(GeneralUtil.removeLinesSpaces(item.getTipologia()));

        String data_inizio = item.getData_inizio();
        String data_fine = item.getData_fine();

        String data = "";

        if(data_fine == null)
        {
            data = data_inizio;
        }

        else
        {
            data = "Dal " + data_inizio + " al " + data_fine;
        }

        holder.data.setText(GeneralUtil.removeLinesSpaces(data));

        holder.descrizione.setText(GeneralUtil.removeLinesSpaces(item.getDescrizione()));

        String latitudine = item.getGeo_latitudine();
        String longitudine = item.getGeo_longitudine();

        if(item.getMetri() > 1000)
        {
            holder.kmPosizione.setText((item.getMetri() / 1000) + " km");
        }
        else if(item.getMetri() == 1000)
        {
            holder.kmPosizione.setText("1 km");
        }
        else
        {
            holder.kmPosizione.setText(item.getMetri() + " m");
        }


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

                Intent intent = new Intent(mContext, DettaglioCosaFareActivity.class);
                intent.putExtra("idCosaFare",String.valueOf(item.getId()));
                mContext.startActivity(intent);

            }
        });

    }


    @Override
    public int getItemCount() {
        return mValues.size();
    }

    public void addItem(int position, CosaFare data) {
        mValues.add(position, data);
        notifyItemInserted(position);
    }

    public void addAll(ArrayList<CosaFare> items) {
        mValues.clear();

        for (int i = 0; i < items.size(); i++) {
            mValues.add(items.get(i));
        }

        notifyDataSetChanged();
    }

    public void clearData() {
        mValues.clear();
    }


    public class ViewHolder extends RecyclerView.ViewHolder {
        public RelativeLayout rlMain;
        private ImageView image;
        private TextView nome, data, descrizione, localita, kmPosizione,tipologia;

        public ViewHolder(View view) {
            super(view);
            rlMain = view.findViewById(R.id.rlMain);
            nome = view.findViewById(R.id.nome);
            data = view.findViewById(R.id.data);
            tipologia = view.findViewById(R.id.tipologia);
            descrizione = view.findViewById(R.id.descrizione);
            localita = view.findViewById(R.id.localita);
            kmPosizione = view.findViewById(R.id.kmposizione);
            image = view.findViewById(R.id.image);

        }
    }
}

Answer 1

在 xml -

中尝试下面的框架布局 class

import android.content.Context;
import android.graphics.*;
import android.util.AttributeSet;
import android.util.DisplayMetrics;
import android.util.TypedValue;
import android.widget.FrameLayout;

public class RoundedCornerFrameLayout extends FrameLayout {
private final static float CORNER_RADIUS = 40.0f;

private Bitmap maskBitmap;
private Paint paint, maskPaint;
private float cornerRadius;

public RoundedCornerFrameLayout(Context context) {
    super(context);
    init(context, null, 0);
}

public RoundedCornerFrameLayout(Context context, AttributeSet attrs) {
    super(context, attrs);
    init(context, attrs, 0);
}

public RoundedCornerFrameLayout(Context context, AttributeSet attrs, int defStyle) {
    super(context, attrs, defStyle);
    init(context, attrs, defStyle);
}

private void init(Context context, AttributeSet attrs, int defStyle) {
    DisplayMetrics metrics = context.getResources().getDisplayMetrics();
    cornerRadius = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, CORNER_RADIUS, metrics);

    paint = new Paint(Paint.ANTI_ALIAS_FLAG);

    maskPaint = new Paint(Paint.ANTI_ALIAS_FLAG | Paint.FILTER_BITMAP_FLAG);
    maskPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));

    setWillNotDraw(false);
}

@Override
public void draw(Canvas canvas) {
    Bitmap offscreenBitmap = Bitmap.createBitmap(canvas.getWidth(), canvas.getHeight(), Bitmap.Config.ARGB_8888);
    Canvas offscreenCanvas = new Canvas(offscreenBitmap);

    super.draw(offscreenCanvas);

    if (maskBitmap == null) {
        maskBitmap = createMask(canvas.getWidth(), canvas.getHeight());
    }

    offscreenCanvas.drawBitmap(maskBitmap, 0f, 0f, maskPaint);
    canvas.drawBitmap(offscreenBitmap, 0f, 0f, paint);
}

private Bitmap createMask(int width, int height) {
    Bitmap mask = Bitmap.createBitmap(width, height, Bitmap.Config.ALPHA_8);
    Canvas canvas = new Canvas(mask);

    Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
    paint.setColor(Color.WHITE);

    canvas.drawRect(0, 0, width, height, paint);

    paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));
    canvas.drawRoundRect(new RectF(0, 0, width, height), cornerRadius, cornerRadius, paint);

    return mask;
}

}

在 xml 中使用它，例如 -

<com.example.RoundedCornerFrameLayout
    android:layout_width="250dp"
    android:layout_height="250dp">

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        />
</com.example.RoundedCornerFrameLayout>

Android Studio：在 Recycler 视图内绘制右上角丝带和星形框架布局

Android Studio: Draw top right corner ribbon and star inside frame layout inside recycler view

android

android-framelayout