android - 在协调器布局中折叠布局后保留图像并设置最小高度
问题描述
我正在工作collapseToolbarLayout，在设计中appBar它应该是 appBar 底部锚点中的图像（大多数设计都放一个floatingActionButton..这里我使用的是图像）当我向上滚动时我需要部分折叠，但不是完全折叠. 所以我得到了一些解决方案来为 appBar 从这个自定义高度设置一个最小高度
我尝试了一种解决方案及其工作，但是，当我完全向上滚动图像已被剪切并且工具栏消失时，如何使图像保持原样而不被剪切，floatingActionButton如果按钮消失，如果你明白我的意思就我而言，这是一个图像，我不希望它消失或被剪切
看这张图片以了解发生了什么
我想要的是保持这样的图像在这里以及工具栏
这是布局
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout
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:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context=".MainActivity">
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/pink"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
tools:context=".MainActivity"
android:paddingBottom="?attr/actionBarSize"
tools:showIn="@layout/activity_main"
>
<RelativeLayout
app:layout_behavior="@string/appbar_scrolling_view_behavior"
android:layout_marginTop="80dp"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/transparent">
<TextView
android:id="@+id/offerNameTxt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_marginBottom="20dp"
android:letterSpacing="0.01"
android:text="Get a Pizza Free"
android:textColor="@color/colorPrimary"
android:textSize="34sp"
android:textStyle="bold"/>
<TextView
android:id="@+id/descTitTxt"
style="@style/AppTheme"
android:textColor="@color/colorPrimary"
android:layout_below="@+id/offerNameTxt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Description"
/>
<TextView android:id="@+id/offerDescTxt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="16sp"
android:layout_below="@+id/descTitTxt"
android:fontFamily="sans-serif"
android:textStyle="normal"
android:layout_marginTop="8dp"
android:textColor="@color/colorPrimary"
android:letterSpacing="0.03"
android:lineSpacingExtra="12sp"
android:text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Rutrum
placerat habitant in eget. Enim elementum in sed lorem nisi purus pharetra. Suscipit
pellentesque nibh interdum ultrices enim, amet libero gravida scelerisque Rutrum
placerat."
/>
<View
android:id="@+id/line"
android:layout_width="match_parent"
android:layout_height="2dp"
android:layout_marginTop="100dp"
android:layout_below="@+id/offerDescTxt"
android:background="@color/colorPrimary"
android:alpha="0.4"/>
<LinearLayout
android:id="@+id/socialMediaLayout"
android:layout_marginTop="40dp"
android:layout_below="@+id/line"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center"
android:padding="10dp">
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:tint="@color/colorPrimary"
android:layout_marginEnd="40dp"
android:src="@drawable/ic_launcher_background"/>
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:tint="@color/colorPrimary"
android:layout_marginEnd="40dp"
android:src="@drawable/abc_vector_test"/>
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:tint="@color/colorPrimary"
android:layout_marginEnd="40dp"
android:src="@drawable/ic_launcher_background"/>
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:tint="@color/colorPrimary"
android:layout_marginEnd="40dp"
android:src="@drawable/ic_launcher_foreground"/>
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:tint="@color/colorPrimary"
android:src="@drawable/ic_launcher_foreground"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_marginTop="20dp"
android:layout_below="@+id/socialMediaLayout"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18sp"
android:fontFamily="sans-serif-medium"
android:textStyle="normal"
android:textColor="@color/colorPrimary"
android:letterSpacing="0.01"
android:lineSpacingExtra="6sp"
android:text=" Contact"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18sp"
android:fontFamily="sans-serif-medium"
android:textStyle="normal"
android:textColor="@color/colorPrimary"
android:letterSpacing="0.01"
android:lineSpacingExtra="6sp"
android:text=" Contact"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18sp"
android:fontFamily="sans-serif-medium"
android:textStyle="normal"
android:textColor="@color/colorPrimary"
android:letterSpacing="0.01"
android:lineSpacingExtra="6sp"
android:text=" Contact"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18sp"
android:fontFamily="sans-serif-medium"
android:textStyle="normal"
android:textColor="@color/colorPrimary"
android:letterSpacing="0.01"
android:lineSpacingExtra="6sp"
android:text=" Contact"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18sp"
android:fontFamily="sans-serif-medium"
android:textStyle="normal"
android:textColor="@color/colorPrimary"
android:letterSpacing="0.01"
android:lineSpacingExtra="6sp"
android:text=" Contact"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18sp"
android:fontFamily="sans-serif-medium"
android:textStyle="normal"
android:textColor="@color/colorPrimary"
android:letterSpacing="0.01"
android:lineSpacingExtra="6sp"
android:text=" Contact"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18sp"
android:fontFamily="sans-serif-medium"
android:textStyle="normal"
android:textColor="@color/colorPrimary"
android:letterSpacing="0.01"
android:lineSpacingExtra="6sp"
android:text=" Contact"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18sp"
android:fontFamily="sans-serif-medium"
android:textStyle="normal"
android:textColor="@color/colorPrimary"
android:letterSpacing="0.01"
android:lineSpacingExtra="6sp"
android:text=" Contact"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18sp"
android:fontFamily="sans-serif-medium"
android:textStyle="normal"
android:textColor="@color/colorPrimary"
android:letterSpacing="0.01"
android:lineSpacingExtra="6sp"
android:text=" Contact"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18sp"
android:fontFamily="sans-serif-medium"
android:textStyle="normal"
android:textColor="@color/colorPrimary"
android:letterSpacing="0.01"
android:lineSpacingExtra="6sp"
android:text=" Contact"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18sp"
android:fontFamily="sans-serif-medium"
android:textStyle="normal"
android:textColor="@color/colorPrimary"
android:letterSpacing="0.01"
android:lineSpacingExtra="6sp"
android:text=" Contact"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18sp"
android:fontFamily="sans-serif-medium"
android:textStyle="normal"
android:textColor="@color/colorPrimary"
android:letterSpacing="0.01"
android:lineSpacingExtra="6sp"
android:text=" Contact"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18sp"
android:fontFamily="sans-serif-medium"
android:textStyle="normal"
android:textColor="@color/colorPrimary"
android:letterSpacing="0.01"
android:lineSpacingExtra="6sp"
android:text=" Contact"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18sp"
android:fontFamily="sans-serif-medium"
android:textStyle="normal"
android:textColor="@color/colorPrimary"
android:letterSpacing="0.01"
android:lineSpacingExtra="6sp"
android:text=" Contact"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18sp"
android:fontFamily="sans-serif-medium"
android:textStyle="normal"
android:textColor="@color/colorPrimary"
android:letterSpacing="0.01"
android:lineSpacingExtra="6sp"
android:text=" Contact"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18sp"
android:fontFamily="sans-serif-medium"
android:textStyle="normal"
android:textColor="@color/colorPrimary"
android:letterSpacing="0.01"
android:lineSpacingExtra="6sp"
android:text=" Contact"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18sp"
android:fontFamily="sans-serif-medium"
android:textStyle="normal"
android:textColor="@color/colorPrimary"
android:letterSpacing="0.01"
android:lineSpacingExtra="6sp"
android:text=" Contact"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18sp"
android:fontFamily="sans-serif-medium"
android:textStyle="normal"
android:textColor="@color/colorPrimary"
android:letterSpacing="0.01"
android:lineSpacingExtra="6sp"
android:text=" Contact"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18sp"
android:fontFamily="sans-serif-medium"
android:textStyle="normal"
android:textColor="@color/colorPrimary"
android:letterSpacing="0.01"
android:lineSpacingExtra="6sp"
android:text=" Contact"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18sp"
android:fontFamily="sans-serif-medium"
android:textStyle="normal"
android:textColor="@color/colorPrimary"
android:letterSpacing="0.01"
android:lineSpacingExtra="6sp"
android:text=" Contact"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18sp"
android:fontFamily="sans-serif-medium"
android:textStyle="normal"
android:textColor="@color/colorPrimary"
android:letterSpacing="0.01"
android:lineSpacingExtra="6sp"
android:text=" Contact"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18sp"
android:fontFamily="sans-serif-medium"
android:textStyle="normal"
android:textColor="@color/colorPrimary"
android:letterSpacing="0.01"
android:lineSpacingExtra="6sp"
android:text=" Contact"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18sp"
android:fontFamily="sans-serif-medium"
android:textStyle="normal"
android:textColor="@color/colorPrimary"
android:letterSpacing="0.01"
android:lineSpacingExtra="6sp"
android:text=" Contact"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18sp"
android:fontFamily="sans-serif-medium"
android:textStyle="normal"
android:textColor="@color/colorPrimary"
android:letterSpacing="0.01"
android:lineSpacingExtra="6sp"
android:text=" Contact"
/>
</LinearLayout>
</RelativeLayout>
</androidx.core.widget.NestedScrollView>
<com.google.android.material.appbar.AppBarLayout
android:id="@+id/app_bar"
android:layout_width="match_parent"
android:layout_height="300dp"
android:fitsSystemWindows="true">
<om.metamorph.mycollapsingdemo.CustomCollapseLayout
android:id="@+id/toolbar_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:minHeight="100dp"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
android:id="@+id/expandedImage"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitXY"
android:background="@drawable/immmg"
app:layout_collapseMode="parallax"
app:layout_collapseParallaxMultiplier="0.7" />
<androidx.appcompat.widget.Toolbar
android:id="@+id/toolbar"
android:background="@color/colorPrimary"
android:alpha="0.8"
android:gravity="center"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center">
<TextView
android:id="@+id/TitleTxt"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:fontFamily="sans-serif-medium"
android:gravity="bottom|center"
android:text="Pizza Hut"
android:textColor="@color/colorAccent"
android:textSize="18sp"
android:textStyle="bold" />
</RelativeLayout>
</androidx.appcompat.widget.Toolbar>
</om.metamorph.mycollapsingdemo.CustomCollapseLayout>
</com.google.android.material.appbar.AppBarLayout>
<ImageView
android:id="@+id/fab"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_margin="16dp"
app:layout_anchor="@id/app_bar"
app:layout_anchorGravity="bottom|start"
android:src="@drawable/img22" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
这里是 MainActivity
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
final ImageView fab = (ImageView) findViewById(R.id.fab);
fab.bringToFront();
AppBarLayout mAppBarLayout = (AppBarLayout) findViewById(R.id.app_bar);
mAppBarLayout.addOnOffsetChangedListener(new AppBarLayout.OnOffsetChangedListener() {
boolean isShow = false;
int scrollRange = -1;
@Override
public void onOffsetChanged(AppBarLayout appBarLayout, int verticalOffset) {
/**
* Collapsed
*/
if (Math.abs(verticalOffset) == appBarLayout.getTotalScrollRange()) {
fab.animate().scaleX((float)0.4).setDuration(3000);
fab.animate().scaleY((float)0.4).setDuration(3000);
fab.animate().alpha(1).setDuration(0);
/**
* Expanded
*/
} else if (verticalOffset == 0) {
fab.animate().scaleX((float)1).setDuration(100);
fab.animate().scaleY((float)1).setDuration(100);
fab.animate().alpha(1).setDuration(0);
/**
* Somewhere in between
*/
} else {
final int scrollRange = appBarLayout.getTotalScrollRange();
float offsetFactor = (float) (-verticalOffset) / (float) scrollRange;
float scaleFactor = 1F - offsetFactor * .5F;
fab.animate().scaleX(scaleFactor);
fab.animate().scaleY(scaleFactor);
}
}
});
}
}
这是我用来将高度固定为我想要的自定义折叠布局类，
public class CustomCollapseLayout extends FrameLayout {
private static final String TAG = "CollapsingImageLayout";
private WindowInsetsCompat mLastInsets;
private int mImageTopExpanded;
private int mImageTopCollapsed;
private OnOffsetChangedListener mOnOffsetChangedListener;
public CustomCollapseLayout(Context context) {
this(context, null);
}
public CustomCollapseLayout(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public CustomCollapseLayout(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
mImageTopCollapsed = getResources().getDimensionPixelOffset(R.dimen.image_top_margin_collapsed);
ViewCompat.setOnApplyWindowInsetsListener(this,
new androidx.core.view.OnApplyWindowInsetsListener() {
@Override
public WindowInsetsCompat onApplyWindowInsets(View v, WindowInsetsCompat insets) {
return setWindowInsets(insets);
}
});
}
@Override
protected void onAttachedToWindow() {
super.onAttachedToWindow();
// Add an OnOffsetChangedListener if possible
final ViewParent parent = getParent();
if (parent instanceof AppBarLayout) {
if (mOnOffsetChangedListener == null) {
mOnOffsetChangedListener = new OnOffsetChangedListener();
}
((AppBarLayout) parent).addOnOffsetChangedListener(mOnOffsetChangedListener);
}
// We're attached, so lets request an inset dispatch
ViewCompat.requestApplyInsets(this);
}
private WindowInsetsCompat setWindowInsets(WindowInsetsCompat insets) {
if (mLastInsets != insets) {
mLastInsets = insets;
requestLayout();
}
return insets.consumeSystemWindowInsets();
}
class OnOffsetChangedListener implements AppBarLayout.OnOffsetChangedListener {
@Override
public void onOffsetChanged(AppBarLayout appBarLayout, int verticalOffset) {
}
}
}
请帮助我是新手cllapsetoolbarlayout，如果有不清楚的地方请告诉我，提前谢谢
解决方案
这里的技巧是ImageView在其他布局之上赋予它更高的 z-index
final ImageView fab = (ImageView) findViewById(R.id.fab);
ViewCompat.setTranslationZ(fab, 100);
推荐阅读
- c - 如何仅打印递归函数中找到的文件的文件树？
- node.js - 为什么来自 Firebase Cloud Messaging 的消息 ID 为空
- java - netty 中的 ByteBuf 泄漏 - 仍然无法解决
- django - 无法将 MongoDB 连接到 Django
- node.js - 如何从数据库中加载选定的项目？
- c++ - 排序由 char 组成的列表
- derby - 无法重新连接到 Apache Derby（嵌入式）服务器 Ubuntu 20.04 Eclipse
- selenium - 每次将分支合并到开发中时，是否可以在 Github 操作中运行此测试
- git - 尽管我的凭据在 .gitconfig 中，但 Git 总是询问我的凭据
- c - GCC 突兀地优化了我不想优化的代码片段，我让一切变得不稳定