android 仿QQ五毛特效之查看红包领取详情界面

根据以上分析我们可以猜想出这个钱包领取详情几面的布局

---

最大的布局为RelativeLayout

第一个child为发起者的图片部分 不用填写属性

第二个child为全屏的ScrollView 同样不用写属性

这样我们看到ScrollView 覆盖在发起者图片部分上方

然后ScrollView的布局组成部分为

第一个child为一个与发起者图片部分同等大小的透明的View

第二个就是下方的列表ListView等

发起者部分的宽度为屏幕的宽度，我们可以根据一定的比例  宽：高=3  设置发起者部分,ScrollView中透明部分宽高

//屏幕的宽高单位为px，所以我们在布局中需要转换为dp

width = ScreenUtils.getScreenWidth(this);

height = ScreenUtils.getScreenHeight(this);

/**

• 获得屏幕宽度

*/

public static int getScreenWidth(Context context) {

WindowManager wm = (WindowManager) context

.getSystemService(Context.WINDOW_SERVICE);

DisplayMetrics outMetrics = new DisplayMetrics();

wm.getDefaultDisplay().getMetrics(outMetrics);

int width = outMetrics.widthPixels;

return width;

}

/**

• 获得屏幕高度

*/

public static int getScreenHeight(Context context) {

WindowManager wm = (WindowManager) context

.getSystemService(Context.WINDOW_SERVICE);

DisplayMetrics outMetrics = new DisplayMetrics();

wm.getDefaultDisplay().getMetrics(outMetrics);

int height = outMetrics.heightPixels;

return height;

}

需要写一个自定义的ScrollView 来获取滚动的高度

import android.content.Context;

import android.util.AttributeSet;

import android.widget.ScrollView;

//重写ScrollView

public class NotifyingScrollView extends ScrollView {

/**

• @author Cyril Mottier

*/

public interface OnScrollChangedListener {

void onScrollChanged(ScrollView who, int l, int t, int oldl, int oldt);

}

private OnScrollChangedListener mOnScrollChangedListener;

public NotifyingScrollView(Context context) {

super(context);

}

public NotifyingScrollView(Context context, AttributeSet attrs) {

super(context, attrs);

}

public NotifyingScrollView(Context context, AttributeSet attrs, int defStyle) {

super(context, attrs, defStyle);

}

/**

• t 为目前滑动的高度

*/

@Override

protected void onScrollChanged(int l, int t, int oldl, int oldt) {

super.onScrollChanged(l, t, oldl, oldt);

if (mOnScrollChangedListener != null) {

mOnScrollChangedListener.onScrollChanged(this, l, t, oldl, oldt);

}

}

public void setOnScrollChangedListener(OnScrollChangedListener listener) {

mOnScrollChangedListener = listener;

}

}

MainActivity代码

package com.yqy.cmd;

import android.app.Activity;

import android.os.Bundle;

import android.view.Menu;

import android.view.View;

import android.view.ViewGroup.LayoutParams;

import android.widget.ImageView;

import android.widget.LinearLayout;

import android.widget.RelativeLayout;

import android.widget.ScrollView;

import com.yqy.cmd.NotifyingScrollView.OnScrollChangedListener;

public class MainActivity extends Activity {

private ImageView topIv;

private NotifyingScrollView mySv;

private View view;

private LinearLayout myLl;

private int width;

private int height;

private int allowHeight;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

topIv = (ImageView) findViewById(R.id.topIv);

mySv = (NotifyingScrollView) findViewById(R.id.mySv);

view = findViewById(R.id.view);

myLl = (LinearLayout) findViewById(R.id.myLl);

//屏幕的宽高单位为px，所以我们在布局中需要转换为dp

width = ScreenUtils.getScreenWidth(this);

height = ScreenUtils.getScreenHeight(this);

allowHeight = Utils.px2dip(this, height) / 3;

topIv.setLayoutParams(new RelativeLayout.LayoutParams(

LayoutParams.MATCH_PARENT, Utils.px2dip(this, height) / 3));

view.setLayoutParams(new LinearLayout.LayoutParams(

LayoutParams.MATCH_PARENT, Utils.px2dip(this, height) / 3));

mySv.setOnScrollChangedListener(new OnScrollChangedListener() {

@Override

public void onScrollChanged(ScrollView who, int l, int t, int oldl, int oldt) {

if(t < allowHeight){

int height = allowHeight - t;

topIv.setLayoutParams(new RelativeLayout.LayoutParams(height*3, height));

}

}

});

}

@Override

public boolean onCreateOptionsMenu(Menu menu) {

getMenuInflater().inflate(R.menu.main, menu);

return true;

}

}

activity_main布局

【附】相关架构及资料

往期Android高级架构资料、源码、笔记、视频。高级UI、性能优化、架构师课程、NDK、混合式开发（ReactNative+Weex）微信小程序、Flutter全方面的Android进阶实践技术，群内还有技术大牛一起讨论交流解决问题。
《Android学习笔记总结+移动架构视频+大厂面试真题+项目实战源码》，点击传送门，即可获取！

【附】相关架构及资料

[外链图片转存中…(img-K4qWq3CG-1714558325011)]

[外链图片转存中…(img-e1l9Uc5q-1714558325014)]

往期Android高级架构资料、源码、笔记、视频。高级UI、性能优化、架构师课程、NDK、混合式开发（ReactNative+Weex）微信小程序、Flutter全方面的Android进阶实践技术，群内还有技术大牛一起讨论交流解决问题。
《Android学习笔记总结+移动架构视频+大厂面试真题+项目实战源码》，点击传送门，即可获取！