仅在折叠时显示折叠工具栏布局标题

我试过 setExpandedTitleColor和 setCollapsedTitleColor(切换到透明和从透明) ，但没有成功。我也看不到任何内置的方法可以完成我想要的工作。

我只想在折叠工具栏布局完全折叠时显示标题，否则，我需要隐藏它。

有线索吗？

99493 次浏览
小开

我能够通过在 xml 布局中添加以下属性来获得预期的效果:

app:expandedTitleTextAppearance="@android:color/transparent"

所以我的折叠工具栏布局是这样的

<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/collapsingToolbarLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:expandedTitleTextAppearance="@android:color/transparent"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
小开

我尝试了 dlohani 的解决方案，但不喜欢它，因为淡出。 使用此解决方案，可以完全消除褪色。

诀窍是创建一个 textSize 等于0.1 sp 或0sp 的新样式(这个样式在 SDK < 19时崩溃) ，textColor 透明:

对于 SDK < 19

<style name="CollapsingToolbarLayoutExpandedTextStyle" parent="AppTheme">
<item name="android:textColor">@android:color/transparent</item>
<item name="android:textSize">0.1sp</item>
</style>

对于 SDK > = 19

<style name="CollapsingToolbarLayoutExpandedTextStyle" parent="AppTheme">
<item name="android:textColor">@android:color/transparent</item>
<item name="android:textSize">0sp</item>
</style>

然后将其应用到布局中的 CollapsingToolbarLayout:

    <android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:expandedTitleTextAppearance="@style/CollapsingToolbarLayoutExpandedTextStyle"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
小开
最佳答案

您可以将 OnOffsetChangedListener添加到 AppBarLayout以确定 CollapsingToolbarLayout何时折叠或展开并设置其标题。

爪哇咖啡

final CollapsingToolbarLayout collapsingToolbarLayout = (CollapsingToolbarLayout) findViewById(R.id.collapsingToolbarLayout);
AppBarLayout appBarLayout = (AppBarLayout) findViewById(R.id.appBarLayout);
appBarLayout.addOnOffsetChangedListener(new AppBarLayout.OnOffsetChangedListener() {
boolean isShow = true;
int scrollRange = -1;


@Override
public void onOffsetChanged(AppBarLayout appBarLayout, int verticalOffset) {
if (scrollRange == -1) {
scrollRange = appBarLayout.getTotalScrollRange();
}
if (scrollRange + verticalOffset == 0) {
collapsingToolbarLayout.setTitle("Title");
isShow = true;
} else if(isShow) {
collapsingToolbarLayout.setTitle(" ");//careful there should a space between double quote otherwise it wont work
isShow = false;
}
}
});

科特林

var isShow = true
var scrollRange = -1
appBarLayout.addOnOffsetChangedListener(AppBarLayout.OnOffsetChangedListener { barLayout, verticalOffset ->
if (scrollRange == -1){
scrollRange = barLayout?.totalScrollRange!!
}
if (scrollRange + verticalOffset == 0){
collapsingToolbarLayout.title = "Title Collapse"
isShow = true
} else if (isShow){
collapsingToolbarLayout.title = " " //careful there should a space between double quote otherwise it wont work
isShow = false
}
})
小开

我有一个更简单的答案:

final CollapsingToolbarLayout collapsingToolbarLayout = (CollapsingToolbarLayout) findViewById(R.id.toolbar_layout);


collapsingToolbarLayout.setTitle("Your Title");
collapsingToolbarLayout.setExpandedTitleColor(getResources().getColor(R.color.transperent)); // transperent color = #00000000
collapsingToolbarLayout.setCollapsedTitleTextColor(Color.rgb(0, 0, 0)); //Color of your title

编码愉快！

小开

这对我有用。

final Toolbar tool = (Toolbar)findViewById(R.id.toolbar);
CollapsingToolbarLayout c = (CollapsingToolbarLayout)findViewById(R.id.collapsing_toolbar);
AppBarLayout appbar = (AppBarLayout)findViewById(R.id.app_bar_layout);
tool.setTitle("");
setSupportActionBar(tool);
c.setTitleEnabled(false);


appbar.addOnOffsetChangedListener(new AppBarLayout.OnOffsetChangedListener() {
boolean isVisible = true;
int scrollRange = -1;
@Override
public void onOffsetChanged(AppBarLayout appBarLayout, int verticalOffset) {
if (scrollRange == -1) {
scrollRange = appBarLayout.getTotalScrollRange();
}
if (scrollRange + verticalOffset == 0) {
tool.setTitle("Title");
isVisible = true;
} else if(isVisible) {
tool.setTitle("");
isVisible = false;
}
}
});
小开

下面是使用 api 23的最简单可行的解决方案:

属性必须继承 Text卖相。

因此，在 styles.xml 中添加以下行:

<style name="TransparentText" parent="@android:style/TextAppearance">
<item name="android:textColor">#00000000</item>
</style>

然后，在 CollapsingToolbarLayout 中添加此行。

app:expandedTitleTextAppearance="@style/TransparentText"

就这样了！

小开

我的解决办法是:

collapsingToolbar.setCollapsedTitleTextAppearance(R.style.personal_collapsed_title);
collapsingToolbar.setExpandedTitleTextAppearance(R.style.personal_expanded_title);


<style name="personal_collapsed_title">
<item name="android:textSize">18sp</item>
<item name="android:textColor">@color/black</item>
</style>


<style name="personal_expanded_title">
<item name="android:textSize">0sp</item>
</style>
小开

我成功地添加了一个渐变文本视图，只需在工具栏中添加一个文本视图，然后基于 Appbar 回调中的 verticalOffset 设置它的 alpha

mAppBarLayout.addOnOffsetChangedListener(new AppBarLayout.OnOffsetChangedListener() {


@Override
public void onOffsetChanged(AppBarLayout appBarLayout, int verticalOffset) {


mTitleTextView.setAlpha(Math.abs(verticalOffset / (float)
appBarLayout.getTotalScrollRange()));
}
});
小开

在我看来，一个更优雅的解决方案应该是这样的。

public class MyCollapsingToolbarLayout extends CollapsingToolbarLayout {


private final int toolbarId;
@Nullable private Toolbar toolbar;


public MyCollapsingToolbarLayout(Context context, AttributeSet attrs) {
super(context, attrs);


setTitleEnabled(false);


TypedArray a = context.obtainStyledAttributes(attrs,
R.styleable.CollapsingToolbarLayout, 0,
R.style.Widget_Design_CollapsingToolbar);


toolbarId = a.getResourceId(android.support.design.R.styleable.CollapsingToolbarLayout_toolbarId, -1);


a.recycle();


}


@Override public void setScrimsShown(boolean shown, boolean animate) {
super.setScrimsShown(shown, animate);


findToolbar();
if (toolbar != null) {
toolbar.setTitleTextColor(shown ? Color.WHITE : Color.TRANSPARENT);
}
}


private void findToolbar() {
if (toolbar == null) {
toolbar = (Toolbar) findViewById(toolbarId);
}
}


}

使用情况应该是这样的

<butter.droid.widget.BurtterCollapsingToolbarLayout
app:toolbarId="@+id/toolbar"
...>

也有可能淡出/在文本中，而不仅仅是显示或隐藏它。

小开

这个代码对我很有用: 使用 color.parse 颜色，因为如果背景颜色不同，则用白色替换，标题不显示

collapsingToolbarLayout.setExpandedTitleColor(Color.parseColor("#00FFFFFF"));

或者您可以使用透明 collapsingToolbarLayout.setExpandedTitleColor(Color.TRANSPARENT);

小开

下面的解决方案非常有效。

appbar.addOnOffsetChangedListener(new AppBarLayout.OnOffsetChangedListener() {
@Override
public void onOffsetChanged(AppBarLayout appBarLayout, int verticalOffset) {
if (Math.abs(verticalOffset)-appBarLayout.getTotalScrollRange() == 0)
{
// Collapsed
setTitle("Title To Show");
}
else
{
// Expanded
setTitle("");
}
}
});
小开

这是 Kotlin 的版本，对我很有用:

appbar.addOnOffsetChangedListener(object : OnOffsetChangedListener {
var isShow = true
var scrollRange = -1
override fun onOffsetChanged(appBarLayout: AppBarLayout, verticalOffset: Int) {
if (scrollRange == -1) scrollRange = appBarLayout.totalScrollRange


if (scrollRange + verticalOffset == 0) {
toolbarLayout.title = "Title"
isShow = true
} else if (isShow) {
toolbarLayout.title = " " //These quote " " with _ space is intended
isShow = false
}
}
})
小开

加上这段代码:

     CollapsingToolbarLayout collapsingToolbarLayout = findViewById(R.id.collaps_main);


collapsingToolbarLayout.setExpandedTitleColor(ContextCompat.getColor(this , android.R.color.transparent));
小开

科特林分机:

fun AppBarLayout.onAppBarLayoutCollapsed(
isShowing: (isShow: Boolean) -> Unit
) {
var isShow: false
var scrollRange = -1
this.addOnOffsetChangedListener(AppBarLayout.OnOffsetChangedListener { barLayout, verticalOffset ->
if (scrollRange == -1) {
scrollRange = barLayout?.totalScrollRange!!
}
isShow = scrollRange + verticalOffset == 0
isShowing.invoke(isShow)
})

然后:

appBarLayout.onAppBarLayoutCollapsed({
if(it){
///set text
}else{
///remove text
}
})

提交答案