仿知乎的广告栏学习
Screenshot_2019-05-25-16-08-00.png Screenshot_2019-05-25-16-08-04.png Screenshot_2019-05-25-16-08-07.png Screenshot_2019-05-25-16-32-09.png思路
自定义View 继承自imgView
然后通过canvas 对图片进行局部绘制
进行局部的绘制就需要获取itemview的位置
Activity的代码
import android.databinding.DataBindingUtil;
import android.support.annotation.NonNull;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.view.View;
import com.chen.testapplciation.R;
import com.chen.testapplciation.databinding.ActivityRvAdvertisementBinding;
public class Rv_advertisement extends AppCompatActivity {
ActivityRvAdvertisementBinding binding;
LinearLayoutManager mLinearLayoutManager;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
mLinearLayoutManager = new LinearLayoutManager(this,LinearLayoutManager.VERTICAL,false);
binding = DataBindingUtil.setContentView(this,R.layout.activity_rv_advertisement);
binding.rvAdvertisement.setAdapter(new MyAdapter());
binding.rvAdvertisement.setLayoutManager(mLinearLayoutManager);
binding.rvAdvertisement.addOnScrollListener(new RecyclerView.OnScrollListener() {
@Override
public void onScrolled(@NonNull RecyclerView recyclerView, int dx, int dy) {
super.onScrolled(recyclerView, dx, dy);
int fpos = mLinearLayoutManager.findFirstVisibleItemPosition();
int lpos =mLinearLayoutManager.findLastVisibleItemPosition();
for (int i = fpos; i < lpos; i++) {
View view = mLinearLayoutManager.findViewByPosition(i);
AdimageView adimageView = view.findViewById(R.id.img_av);
if (adimageView != null){
adimageView.setTextView(binding.textMdy);
int dy1 = mLinearLayoutManager.getHeight() - view.getTop();
binding.textDy.setText("itemview顶部到底部的高"+dy1+" \n" + "recyclerview=" +mLinearLayoutManager.getHeight() + " \n"+"图片item到顶部的距离"+view.getTop());
adimageView.setDy(dy1);
}
}
}
});
}
}
我直接用的 databinding
来获取Recycleview
layout 为了理清思路 我把一些参数显示出来
<?xml version="1.0" encoding="utf-8"?>
<layout 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"
tools:context=".donghua.Rv_advertisement">
<data>
</data>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
>
<TextView
android:id="@+id/text_dy"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="10sp"
android:text="0"
android:gravity="center"/>
<TextView
android:id="@+id/text_mdy"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="10sp"
android:text="0"
android:gravity="center"/>
<android.support.v7.widget.RecyclerView
android:id="@+id/rv_advertisement"
android:layout_width="match_parent"
android:layout_height="wrap_content">
</android.support.v7.widget.RecyclerView>
</LinearLayout>
</layout>
adapter
import android.support.annotation.NonNull;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import com.chen.testapplciation.R;
import java.util.ArrayList;
public class MyAdapter extends RecyclerView.Adapter {
ArrayList<String> data = new ArrayList<>();
@Override
public int getItemViewType(int position) {
if (position%10 ==0){
return 1;
}
return 0;
}
@NonNull
@Override
public RecyclerView.ViewHolder onCreateViewHolder(@NonNull ViewGroup viewGroup, int i) {
if (i ==0){
View view = LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.rv_item_textview,viewGroup,false);
return new ViewHolder(view);
}else {
View view =LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.rv_item_advertisement,viewGroup,false);
return new AdtViewHolder(view);
}
}
@Override
public void onBindViewHolder(@NonNull RecyclerView.ViewHolder viewHolder, int i) {
AdimageView adimageView = viewHolder.itemView.findViewById(R.id.img_av);
if (adimageView != null){
adimageView.setnotvisible();
}
}
@Override
public int getItemCount() {
return 100;
}
static class ViewHolder extends RecyclerView.ViewHolder {
public ViewHolder(@NonNull View itemView) {
super(itemView);
}
}
static class AdtViewHolder extends RecyclerView.ViewHolder {
public AdtViewHolder(@NonNull View itemView) {
super(itemView);
}
}
}
adapter 就两个Viewholder
一种显示图片
一种显示文字
onBindViewHolder
因为recyclerview
复用viewholder
。所以一定 要初始化一下viewholder
俩个viewholder的layout
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="200dp">
<com.chen.testapplciation.donghua.AdimageView
android:id="@+id/img_av"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="@drawable/nav_bc_0"
android:scaleType="centerCrop"
/>
</FrameLayout>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="100dp">
<TextView
android:layout_margin="12dp"
android:id="@+id/id_tv_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="这是title"
android:textSize="16dp"
android:textStyle="bold" />
<TextView
android:id="@+id/id_tv_desc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/id_tv_title"
android:layout_marginLeft="12dp"
android:layout_marginRight="12dp"
android:layout_marginBottom="12dp"
android:text="这是描述" />
</RelativeLayout>
其中adimgview 就是自定义的view
Adimgview代码
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.RectF;
import android.graphics.drawable.BitmapDrawable;
import android.graphics.drawable.Drawable;
import android.support.v7.widget.AppCompatImageView;
import android.util.AttributeSet;
import android.util.Log;
import android.widget.TextView;
public class AdimageView extends AppCompatImageView {
private RectF mBitmapRectF;
private Bitmap mBitmap;
private TextView mTextView;
private int mMinDy = 0;
public void setTextView(TextView textView) {
mTextView = textView;
}
public AdimageView(Context context, AttributeSet attrs) {
super(context, attrs);
}
int showwidth;
@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged(w, h, oldw, oldh);
showwidth = w;
mMinDy = h;
Drawable drawable = getDrawable();
if (drawable == null) {
return;
}
mBitmap = drawableToBitamp(drawable);
mBitmapRectF = new RectF(0, 0, w, mBitmap.getHeight() * w / mBitmap.getWidth());
}
private Bitmap drawableToBitamp(Drawable drawable) {
if (drawable instanceof BitmapDrawable) {
BitmapDrawable bd = (BitmapDrawable) drawable;
return bd.getBitmap();
}
int w = drawable.getIntrinsicWidth();
int h = drawable.getIntrinsicHeight();
Bitmap bitmap = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(bitmap);
drawable.setBounds(0, 0, w, h);
drawable.draw(canvas);
return bitmap;
}
private int mDy;
public void setDy(int dy) {
if (getDrawable() == null) {
return;
}
mDy = dy - mMinDy;
if (mDy <= 0) {
mDy = 0;
}
if (mDy > mBitmapRectF.height() - mMinDy) {
mDy = (int) (mBitmapRectF.height() - mMinDy);
}
mTextView.setText("绘制偏移量"+mDy+"\n "+"imgageview显示的高度=" +mMinDy +"\n"+" 图片的缩小后的高度"+height );
invalidate();
}
int bitmapheight ;
int bitmapwidth ;
int height =0;
public void setnotvisible() {
mDy =0;
}
@Override
protected void onDraw(Canvas canvas) {
if (mBitmap == null) {
return;
}
bitmapheight = mBitmap.getHeight();
bitmapwidth= mBitmap.getWidth();
height = bitmapheight *showwidth/bitmapwidth;
canvas.save();
canvas.translate(0,-mDy);
canvas.drawBitmap(mBitmap, null, mBitmapRectF, null);
canvas.restore();
}
}
再梳理一下过程
在Activity中给recyclerview的LinearLayoutManager 绑定一个监听(onScroollListener()
),
监听滚动
找到可显示的item中的 有 AdimgView的item,然后recyclerview的高度减去itemview顶部的高度得到
itemview顶部到底部的高度,
将次高度传入adimgview中
这个高度减去adimgview自身的高度。就是canvas 作图的偏移量
然后通过这个偏移量canva 画出bitmap任意的一部分内容
网友评论