Как сделать прозрачный или полупрозрачный ActionBar как Google Play, который исчезает или прокручивается при прокрутке с помощью windowActionBarOverlay
?
Проверьте следующие снимки экрана
Как сделать прозрачный или полупрозрачный ActionBar как Google Play, который исчезает или прокручивается при прокрутке с помощью windowActionBarOverlay
?
Проверьте следующие снимки экрана
Ниже приведен код, который я использовал в приложении, которое я работаю
Вам нужно будет использовать функцию OnScrollChanged
в ScrollView
. ActionBar
не позволяет установить непрозрачность, поэтому установите фоновый рисунок на панели действий, и вы можете изменить его непрозрачность на основе количества прокрутки в прокрутке. Я привел пример рабочего процесса
Наборы функций задают соответствующую альфу для объекта locationImage на основе его окна WRT позиции.
this.getScrollY()
дает вам, сколько прокрутила ScrollView
public void OnScrollChanged(int l, int t, int oldl, int oldt) {
// Code ...
locationImage.setAlpha(getAlphaForView(locationImageInitialLocation- this.getScrollY()));
}
private float getAlphaForView(int position) {
int diff = 0;
float minAlpha = 0.4f, maxAlpha = 1.f;
float alpha = minAlpha; // min alpha
if (position > screenHeight)
alpha = minAlpha;
else if (position + locationImageHeight < screenHeight)
alpha = maxAlpha;
else {
diff = screenHeight - position;
alpha += ((diff * 1f) / locationImageHeight)* (maxAlpha - minAlpha); // 1f and 0.4f are maximum and min
// alpha
// this will return a number betn 0f and 0.6f
}
// System.out.println(alpha+" "+screenHeight +" "+locationImageInitialLocation+" "+position+" "+diff);
return alpha;
}
EDIT: я добавил пример рабочего примера в https://github.com/ramanadv/fadingActionBar, вы можете посмотреть его.
Пожалуйста, просмотрите эту библиотеку https://github.com/ManuelPeinado/FadingActionBar, которая реализует эффект эффектного эффекта эффектной выцветания, который вы хотите
Эта библиотека помогает для анимации https://github.com/ksoichiro/Android-ObservableScrollView
Официальный документ Google DeveloperDocumentation
панель действий в режиме наложения.
Включить режим наложения
Чтобы включить режим наложения для панели действий, вам нужно создать настраиваемую тему, которая расширяет существующую тему панели действий и устанавливает для свойства android: windowActionBarOverlay значение true.
Только для Android 3.0 и выше
Если для вашего minSdkVersion установлено значение 11 или выше, ваша пользовательская тема должна использовать тему Theme.Holo(или один из ее потомков) в качестве родительской темы. Например:
<resources>
<!-- the theme applied to the application or activity -->
<style name="CustomActionBarTheme"
parent="@android:style/Theme.Holo">
<item name="android:windowActionBarOverlay">true</item>
</style>
</resources>
Для Android 2.1 и выше
Если ваше приложение использует библиотеку поддержки для совместимости на устройствах с версиями ниже Android 3.0, ваша пользовательская тема должна использовать тему Theme.AppCompat(или один из ее потомков) в качестве родительской темы. Например:
<resources>
<!-- the theme applied to the application or activity -->
<style name="CustomActionBarTheme"
parent="@android:style/Theme.AppCompat">
<item name="android:windowActionBarOverlay">true</item>
<!-- Support library compatibility -->
<item name="windowActionBarOverlay">true</item>
</style>
</resources>
Укажите верхний предел макета
Когда панель действий находится в режиме наложения, она может затенять часть вашего макета, которая должна оставаться видимой. Чтобы гарантировать, что такие элементы остаются под панелью действий все время, добавьте край или дополнение в верхнюю часть представления (ов), используя высоту, указанную actionBarSize. Например:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingTop="?android:attr/actionBarSize">
...
</RelativeLayout>
Существует официальная документация о том, как добиться этого эффекта: https://developer.android.com/training/basics/actionbar/overlaying.html
Изменить: Существует библиотека с открытым исходным кодом ObservableScrollView с большим количеством демонстраций с открытым исходным кодом с различными эффектами ActionBar, включая те, которые вы упомянули. Это отличный ресурс: https://github.com/ksoichiro/Android-ObservableScrollView.
Если вы используете координаторLayout в своем макете xml, вы должны проверить эту статью, описывающую, как обрабатывать свитки и реагировать на другие взгляды.
Существует пример выполнения того, что вы просили, если вы добавите свое изображение в качестве дочернего элемента CollapsingToolbarLayout, все магии обрабатываются автоматически, и вы можете даже некоторые параметры, такие как цвет холста, минимальная высота, чтобы начать свертывание и т.д.:
Используя прослушиватель прокрутки AbsListView, мы можем добиться для списка просто без использования другой сложной библиотеки или ScrollView
установить прослушиватель прокрутки в список просмотра
public class PagedScrollListener implements AbsListView.OnScrollListener {
private ActionBar mActionBar;
private View mTopHideView; // represent header view
@Override
public void onScrollStateChanged(final AbsListView view, final int scrollState) {
mScrollState = scrollState;
}
@Override
public void onScroll(final AbsListView view, final int firstVisibleItem, final int visibleItemCount, final int totalItemCount) {
if (mActionBar != null && mTopHideView != null && mListView != null) {
Log.i(TAG, getScrollY() + "");
int currentY = getScrollY();
final int headerHeight = mTopHideView.getHeight() - mActionBar.getHeight();
final float ratio = (float) Math.min(Math.max(currentY, 0), headerHeight) / headerHeight;
final int newAlpha = (int) (ratio * 255);
Log.i(TAG, newAlpha + " alpha");
mActionBarDrawaqble.setAlpha(newAlpha);
}}
public void setActionBarRefernce(ActionBar actionBar, View topHideView, float actionBarHeight, ListView listView) {
mActionBar = actionBar;
mActionBarHeight = actionBarHeight;
mTopHideView = topHideView;
mListView = listView;
mActionBarDrawaqble = new ColorDrawable(ContextCompat.getColor(mContext, R.color.google_plus_red));
mActionBar.setBackgroundDrawable(mActionBarDrawaqble);
mActionBarDrawaqble.setAlpha(0);
}
public int getScrollY() {
View c = mListView.getChildAt(0);
if (c == null) {
return 0;
}
int firstVisiblePosition = mListView.getFirstVisiblePosition();
int top = c.getTop();
int headerHeight = 0;
if (firstVisiblePosition >= 1) {
headerHeight = mTopHideView.getHeight();
}
return -top + firstVisiblePosition * c.getHeight() + headerHeight;
}
}
// Примечание: Не забудьте вызвать ** метод setActionBarRefernce ** пользовательского прослушивателя
В webView:
@JavascriptInterface
public void showToolbar(String scrollY, String imgWidth) {
int int_scrollY = Integer.valueOf(scrollY);
int int_imgWidth = Integer.valueOf(imgWidth);
String clr;
if (int_scrollY<=int_imgWidth-actionBarHeight) {
clr = Integer.toHexString(int_scrollY * 255 / (int_imgWidth-actionBarHeight));
}else{
clr = Integer.toHexString(255);
}
toolbar.setBackgroundDrawable(new ColorDrawable(Color.parseColor("#"+clr+"9CCC65")));
}