Android開源: Hover - 谷歌開源超酷浮動菜單

luojun0513 7年前發布 | 19K 次閱讀 Android Hover UI Android開發 移動開發

簡介

Hover是Android的浮動菜單實現。

目標

Hover的目標是:

  1. 為Android開發人員提供一個易于使用,開箱即用的浮動菜單實現
  2. 為Android開發者提供常用工具,以創建自己的浮動菜單。

Beta通知

懸停仍在大量發展。 還有很多代碼清理要做,所以期望打破API隨時間的變化。

也就是說,Hover應該在這個時候處于可用狀態。

演示

Hover repo中包含演示應用程序。 這里有一些演示的屏幕截圖。

 Demo Hover Menu - Launching Demo Hover Menu - Launching

Demo Hover Menu - Launching Demo Hover Menu - Launching Demo Hover Menu - Launching

入門

從 HoverMenuService派生

從HoverMenuService派生一個子類開始使用Hover,請創建HoverMenuService的子類來托管Hover菜單。 您需要覆蓋的唯一方法是createHoverMenuAdapter(),它將返回您的Hover菜單的內容。

public class MyHoverMenuService extends HoverMenuService {

<span style="color:rgb(167, 29, 93)">@Override</span>
<span style="color:rgb(167, 29, 93)">protected</span> <span style="color:rgb(51, 51, 51)">HoverMenuAdapter</span> <span style="color:rgb(121, 93, 163)">createHoverMenuAdapter</span>() {
    <span style="color:rgb(150, 152, 150)"><span style="color:rgb(150, 152, 150)">//</span> Create and configure your content for the HoverMenu.</span>
    <span style="color:rgb(167, 29, 93)">return</span> myHoverMenuAdapter;
}

}</code></pre>

實現一個HoverMenuAdapter

HoverMenuAdapter很像一個標準的Android適配器。 HoverMenuAdapters為您的懸停菜單中顯示的每個選項卡提供一個視圖。 它還為每個選項卡提供相應的NavigatorContent。

public class MyHoverMenuAdapter extends BaseHoverMenuAdapter {

<span style="color:rgb(167, 29, 93)">private</span> <span style="color:rgb(167, 29, 93)">List<<span style="color:rgb(51, 51, 51)">String</span>></span> mTabs;
<span style="color:rgb(167, 29, 93)">private</span> <span style="color:rgb(167, 29, 93)">Map<<span style="color:rgb(51, 51, 51)">String</span>, <span style="color:rgb(51, 51, 51)">NavigatorContent</span>></span> mContentMap <span style="color:rgb(167, 29, 93)">=</span> <span style="color:rgb(167, 29, 93)">new</span> <span style="color:rgb(167, 29, 93)">HashMap<></span>();

<span style="color:rgb(167, 29, 93)">public</span> <span style="color:rgb(121, 93, 163)">MyHoverMenuAdapter</span>() {
    mTabs <span style="color:rgb(167, 29, 93)">=</span> <span style="color:rgb(51, 51, 51)">Arrays</span><span style="color:rgb(167, 29, 93)">.</span>asList(<span style="color:rgb(24, 54, 145)"><span style="color:rgb(24, 54, 145)">"</span>first<span style="color:rgb(24, 54, 145)">"</span></span>, <span style="color:rgb(24, 54, 145)"><span style="color:rgb(24, 54, 145)">"</span>second<span style="color:rgb(24, 54, 145)">"</span></span>);
    mContentMap<span style="color:rgb(167, 29, 93)">.</span>put(<span style="color:rgb(24, 54, 145)"><span style="color:rgb(24, 54, 145)">"</span>first<span style="color:rgb(24, 54, 145)">"</span></span>, <span style="color:rgb(150, 152, 150)"><span style="color:rgb(150, 152, 150)">/*</span>...<span style="color:rgb(150, 152, 150)">*/</span></span>);
    mContentMap<span style="color:rgb(167, 29, 93)">.</span>put(<span style="color:rgb(24, 54, 145)"><span style="color:rgb(24, 54, 145)">"</span>second<span style="color:rgb(24, 54, 145)">"</span></span>, <span style="color:rgb(150, 152, 150)"><span style="color:rgb(150, 152, 150)">/*</span>...<span style="color:rgb(150, 152, 150)">*/</span></span>);
}

<span style="color:rgb(167, 29, 93)">@Override</span>
<span style="color:rgb(167, 29, 93)">public</span> <span style="color:rgb(167, 29, 93)">void</span> <span style="color:rgb(121, 93, 163)">getTabCount</span>() {
    <span style="color:rgb(167, 29, 93)">return</span> mTabs<span style="color:rgb(167, 29, 93)">.</span>size();
}

<span style="color:rgb(167, 29, 93)">@Override</span>
<span style="color:rgb(167, 29, 93)">public</span> <span style="color:rgb(167, 29, 93)">long</span> <span style="color:rgb(121, 93, 163)">getTabId</span>(<span style="color:rgb(167, 29, 93)">int</span> <span style="color:rgb(237, 106, 67)">position</span>) {
    <span style="color:rgb(167, 29, 93)">return</span> mTabs<span style="color:rgb(167, 29, 93)">.</span>get(position)<span style="color:rgb(167, 29, 93)">.</span>hashCode();
}

<span style="color:rgb(167, 29, 93)">@Override</span>
<span style="color:rgb(167, 29, 93)">public</span> <span style="color:rgb(51, 51, 51)">View</span> <span style="color:rgb(121, 93, 163)">getTabView</span>(<span style="color:rgb(167, 29, 93)">int</span> <span style="color:rgb(237, 106, 67)">position</span>) {
    <span style="color:rgb(51, 51, 51)">String</span> tabName <span style="color:rgb(167, 29, 93)">=</span> mTabs<span style="color:rgb(167, 29, 93)">.</span>get(position);
    <span style="color:rgb(167, 29, 93)">if</span> (<span style="color:rgb(24, 54, 145)"><span style="color:rgb(24, 54, 145)">"</span>first<span style="color:rgb(24, 54, 145)">"</span></span><span style="color:rgb(167, 29, 93)">.</span>equals(tabName)) {
        <span style="color:rgb(150, 152, 150)"><span style="color:rgb(150, 152, 150)">//</span> Create and return the tab View for "first".</span>
    } <span style="color:rgb(167, 29, 93)">else</span> <span style="color:rgb(167, 29, 93)">if</span> (<span style="color:rgb(24, 54, 145)"><span style="color:rgb(24, 54, 145)">"</span>second<span style="color:rgb(24, 54, 145)">"</span></span><span style="color:rgb(167, 29, 93)">.</span>equals(tabName)) {
        <span style="color:rgb(150, 152, 150)"><span style="color:rgb(150, 152, 150)">//</span> Create and return the tab View for "second".</span>
    }
    <span style="color:rgb(150, 152, 150)"><span style="color:rgb(150, 152, 150)">//</span> etc.</span>
}

<span style="color:rgb(167, 29, 93)">@Override</span>
<span style="color:rgb(167, 29, 93)">public</span> <span style="color:rgb(51, 51, 51)">NavigatorContent</span> <span style="color:rgb(121, 93, 163)">getNavigatorContent</span>(<span style="color:rgb(167, 29, 93)">int</span> <span style="color:rgb(237, 106, 67)">position</span>) {
    <span style="color:rgb(51, 51, 51)">String</span> tabName <span style="color:rgb(167, 29, 93)">=</span> mTabs<span style="color:rgb(167, 29, 93)">.</span>get(position);
    <span style="color:rgb(167, 29, 93)">return</span> mContentMap<span style="color:rgb(167, 29, 93)">.</span>get(tabName);
}

}</code></pre>

用HoverMenu直接工作

如果你想從頭開始創建自己的Hover菜單服務,或者如果你想直接試驗一個HoverMenu,你可以自己實例化一個。 使用HoverMenuBuilder為您的特定需求配置HoverMenu。

// Build a HoverMenu.</span>
HoverMenu hoverMenu = new HoverMenuBuilder(context)
                        .displayWithinWindow()
                        .useNavigator(myNavigator)
                        .startAtLocation(savedLocationMemento)
                        .useAdapter(adapter)
                        .build();

// When you're ready for your HoverMenu to appear on screen.</span> hoverMenu.show();

// When you want to remove your HoverMenu from the screen.</span> hoverMenu.hide();

// When you want to force your HoverMenu to expand fullscreen.</span> hoverMenu.expandMenu();

// When you want to force your HoverMenu to collapse to a draggable icon.</span> hoverMenu.collapseMenu();

// When you want to change the tabs and content in your HoverMenu.</span> hoverMenu.setAdapter(otherAdapter);

// When you want to save the display state of your HoverMenu.</span> Parcelable displayState = hoverMenu.createDisplayStateMemento();

// When you want to be notified when your HoverMenu is added to/removed from the display.</span> hoverMenu.addOnVisibilityChangeListener(listener);

// When you want to be notified when your HoverMenu expands or collapses.</span> hoverMenu.addOnCollapseAndExpandListener(listener);</code></pre>

下載

可通過jCenter獲取Hover:

compile 'io.mattcarroll.hover:hover:0.9.6'

問題

在當前時間,懸停菜單不能在正常視圖層次結構中使用。 它只能在窗口中使用。

免責聲明

這不是Google的官方產品。

許可

Copyright (C) 2016 Nest Labs

Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at

http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.</code></pre>

 本文由用戶 luojun0513 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。
 轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!