Android(安卓)给scrollView添加毛玻璃效果的标题栏
16lz
2021-01-26
效果如下
首先是布局文件,头部的标题栏是个压在scrollview上面的自定义控件
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/window" android:layout_width="match_parent" android:layout_height="match_parent" tools:context="com.npi.blureffect.ScrollViewActivity" > <com.npi.blureffect.CustomScrollView android:id="@+id/scrollView1" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_alignParentBottom="true" android:layout_alignParentLeft="true" android:layout_alignParentRight="true" android:layout_alignParentTop="true" > <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" > <Button android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="50dp" android:text="Button" /> <TextView android:id="@+id/textView1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="50dp" android:text="Large Text" android:textAppearance="?android:attr/textAppearanceLarge" /> <RatingBar android:id="@+id/ratingBar1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="50dp" /> <RadioButton android:id="@+id/radioButton1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="50dp" android:text="RadioButton" /> <SeekBar android:id="@+id/seekBar1" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginTop="50dp" /> <ToggleButton android:id="@+id/toggleButton1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="50dp" android:text="ToggleButton" /> <SeekBar android:id="@+id/seekBar2" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginTop="50dp" /> <ProgressBar android:id="@+id/progressBar1" style="?android:attr/progressBarStyleLarge" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="50dp" /> <TextView android:id="@+id/textView2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="50dp" android:text="Large Text" android:textAppearance="?android:attr/textAppearanceLarge" /> <CalendarView android:id="@+id/calendarView1" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_marginTop="50dp" /> </LinearLayout> </com.npi.blureffect.CustomScrollView> <com.npi.blureffect.ScrollableImageView android:id="@+id/blurred_image_header" android:layout_width="match_parent" android:layout_height="50dp" android:background="#e8e8e8" /></RelativeLayout>
下面是自定义的scrollVIew,其实就是把里面探测scrollView滚动的方法给暴露到监听器上去
package com.npi.blureffect;import android.content.Context;import android.util.AttributeSet;import android.util.Log;import android.widget.ScrollView;public class CustomScrollView extends ScrollView {private ScrollViewListener scrollViewListener;public CustomScrollView(Context context) {super(context);// TODO Auto-generated constructor stub}public interface ScrollViewListener { void onScrollChanged(CustomScrollView scrollView, int x, int y, int oldx, int oldy); } public CustomScrollView(Context context, AttributeSet attrs, int defStyle) { super(context, attrs, defStyle); } public CustomScrollView(Context context, AttributeSet attrs) { super(context, attrs); } public void setScrollViewListener(ScrollViewListener scrollViewListener) { this.scrollViewListener = scrollViewListener; } @Override protected void onScrollChanged(int x, int y, int oldx, int oldy) { super.onScrollChanged(x, y, oldx, oldy); if (scrollViewListener != null) { scrollViewListener.onScrollChanged(this, x, y, oldx, oldy); } // Log.i("Alex", "$$$x是:"+x+" oldx是:"+oldx+" Y是"+y+"oldY是"+oldy); } }
然后是最主要的activity
package com.npi.blureffect;import java.io.FileNotFoundException;import java.io.FileOutputStream;import java.io.IOException;import com.npi.blureffect.CustomScrollView.ScrollViewListener;import android.app.Activity;import android.graphics.Bitmap;import android.graphics.Canvas;import android.graphics.Matrix;import android.os.Bundle;import android.util.Log;import android.view.Menu;import android.view.MenuItem;import android.view.MotionEvent;import android.view.View;import android.view.View.OnTouchListener;import android.widget.ScrollView;public class ScrollViewActivity extends Activity {ScrollableImageView header;CustomScrollView scrollView ;Bitmap screen;<span style="white-space:pre"></span>@Override<span style="white-space:pre"></span>protected void onCreate(Bundle savedInstanceState) {<span style="white-space:pre"></span>super.onCreate(savedInstanceState);<span style="white-space:pre"></span>setContentView(R.layout.activity_scroll_view);<span style="white-space:pre"></span>header = (ScrollableImageView) findViewById(R.id.blurred_image_header);<span style="white-space:pre"></span>scrollView = (CustomScrollView) findViewById(R.id.scrollView1);<span style="white-space:pre"></span>initScrollView(header, scrollView);}<span style="white-space:pre"></span>public void initScrollView(final ScrollableImageView header,final CustomScrollView scrollView){<span style="white-space:pre"></span>scrollView.setScrollViewListener(new ScrollViewListener() {<span style="white-space:pre"></span><span style="white-space:pre"></span>@Override<span style="white-space:pre"></span>public void onScrollChanged(CustomScrollView scrollView, int x, int y,<span style="white-space:pre"></span>int oldx, int oldy) {<span style="white-space:pre"></span>// TODO Auto-generated method stub<span style="white-space:pre"></span>Log.i("Alex", "x是:"+x+" oldx是:"+oldx+" Y是"+y+"oldY是"+oldy);<span style="white-space:pre"></span>header.handleScroll(y, 0);<span style="white-space:pre"></span>}<span style="white-space:pre"></span>});<span style="white-space:pre"></span>scrollView.post(new Runnable() {<span style="white-space:pre"></span>@Override<span style="white-space:pre"></span>public void run() {<span style="white-space:pre"></span>// TODO Auto-generated method stub<span style="white-space:pre"></span>screen = getBitmapByView(scrollView);<span style="white-space:pre"></span>header.setoriginalImage(screen);<span style="white-space:pre"></span>}<span style="white-space:pre"></span>});}<span style="white-space:pre"></span>/** * 截取scrollview的屏幕 * **/ public static Bitmap getBitmapByView(ScrollView scrollView) { int h = 0; Bitmap bitmap = null; // 获取listView实际高度 for (int i = 0; i < scrollView.getChildCount(); i++) { h += scrollView.getChildAt(i).getHeight(); } Log.d("Alex", "实际高度:" + h); Log.d("Alex", " 高度:" + scrollView.getHeight()); // 创建对应大小的bitmap bitmap = Bitmap.createBitmap(scrollView.getWidth(), h, Bitmap.Config.ARGB_8888); final Canvas canvas = new Canvas(bitmap); scrollView.draw(canvas); return bitmap; }}
这里用到的自定义图片控件和模糊工具类请到我之前的博客去查看
更多相关文章
- Android(安卓)CoordinatorLayout实战案例学习《一》
- Android控件之AutoCompleteTextView、MultiAutoCompleteTextView
- Android刮奖控件,需要的直接拿去用
- Android中visibility属性详解
- android中下拉框控件——Spinner
- ListView 表格动态设置控件宽度
- android:transcriptMode用法
- Android(4.Activity的基本控件)
- AutoCompleteTextView 无限制输入字符及获得焦点时显示