快捷導(dǎo)航

Android實(shí)現(xiàn)高德地圖首頁(yè)效果(下)

更新時(shí)間：2023年08月30日 09:06:38 作者：似曾相識(shí)2022

這篇文章主要為大家詳細(xì)介紹了基于Android實(shí)現(xiàn)高德地圖首頁(yè)效果下篇,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下

書(shū)接上文Android實(shí)現(xiàn)高德地圖首頁(yè)效果（上），咱們講到能不能通過(guò)滑動(dòng)監(jiān)聽(tīng)玩出新花樣，答案是能。但這里不再是通過(guò)NestedScrollView添加滑動(dòng)監(jiān)聽(tīng)，而是交給咱們的BottomSheetBehavior。

由于BottomSheetBehavior是在xml中配置，那么我們要怎么拿到它呢？?jī)?nèi)部提供了from方法：

val bottomSheetBehavior = BottomSheetBehavior.from(scrollView)

拿到BottomSheetBehavior后通過(guò)addBottomSheetCallback添加監(jiān)聽(tīng)。需要實(shí)現(xiàn)兩個(gè)方法：

public abstract static class BottomSheetCallback {
  //newState 狀態(tài)變化，也就是隱藏、展開(kāi)、半展開(kāi)等狀態(tài)
  public abstract void onStateChanged(@NonNull View bottomSheet, @State int newState);
  //slideOffset 0-1的一個(gè)比例值  代表當(dāng)前位置高度占比
  public abstract void onSlide(@NonNull View bottomSheet, float slideOffset);
}

看到這里，大家應(yīng)該知道應(yīng)該怎么操作了，主要還是集中在onSlide方法中拿到slideOffset值，根據(jù)該值的變化做對(duì)應(yīng)效果展示。

首先，XML中添加搜索框等元素：

<com.google.android.material.textfield.TextInputEditText
    android:id="@+id/search_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_gravity="center_vertical"
    android:background="@null"
    android:drawableStart="@drawable/ic_search_grey"
    android:drawablePadding="8dp"
    android:gravity="center_vertical"
    android:hint="搜索關(guān)鍵詞"
    android:imeOptions="actionSearch"
    android:maxLines="1"
    android:padding="10dp"
    android:singleLine="true"
    android:textColor="@color/text_color_1"
    android:textSize="15dp" />
 <TextView
        android:id="@+id/homeView"
        android:text="漸變"
        android:gravity="center"
        android:background="@drawable/shape_white"
        android:drawableLeft="@drawable/ic_chip_home"
        android:drawablePadding="6dp"
        android:layout_width="wrap_content"
        android:layout_height="30dp"/>

核心邏輯是需要獲取當(dāng)前位置高度，以此來(lái)判斷是否到達(dá)咱們之前設(shè)置的半展開(kāi)高度（注意這里的半展開(kāi)設(shè)置的也是占比值）。當(dāng)滑動(dòng)距離大于半展開(kāi)高度就需要將搜索框向上平移且漸變。同時(shí)搜索框下面的homeView也需要做漸變操作。反之，在收回的時(shí)候當(dāng)距離小于半展開(kāi)狀態(tài)需要恢復(fù)各視圖狀態(tài)。

override fun onSlide(bottomSheet: View, slideOffset: Float) {
//在peekHeight位置以上 滑動(dòng)(向上、向下) slideOffsetbottomSheet.getHeight() 是展開(kāi)后的高度的比例
  if (slideOffset > 0) { 
     val height = bottomSheet.height
     distance = height * slideOffset
     //搜索欄反向位移
     val halfExpandedRatio = bottomSheetBehavior!!.halfExpandedRatio
     val halfHeight = halfExpandedRatio * height //中間狀態(tài)的高度
     if (distance > halfHeight) {
         search_view?.translationY = -(distance - halfHeight)
         search_view?.alpha = 1 - slideOffset + halfExpandedRatio
         homeView?.alpha = 1 - slideOffset
        } else {
         search_view?.translationY = 0f
         search_view?.alpha = 1.0f
         homeView?.alpha = 1.0f
        }
        fabContainer?.alpha = 1 - slideOffset
  }
}

到此，咱們gif展示的效果基本就實(shí)現(xiàn)了。只要你的想象力夠豐富，在這里玩出花都可以。

以上便是實(shí)現(xiàn)高德地圖首頁(yè)效果的全部?jī)?nèi)容，希望對(duì)大家有所幫助。

到此這篇關(guān)于Android實(shí)現(xiàn)高德地圖首頁(yè)效果(下)的文章就介紹到這了,更多相關(guān)Android實(shí)現(xiàn)高德地圖內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

您可能感興趣的文章: