Android Facebook风格幻灯片

我在这里做一些大胆的猜测……

我假设它们有一个表示不可见的菜单的布局。当点击菜单按钮时，它们会在顶部移动布局/视图，并简单地启用菜单布局的可见性。我没有想过这会在视图中引起任何类型的z索引问题，或者他们如何控制它。

我认为facebook应用程序不是用原生代码写的(我指的是在Android中使用布局的原生代码)，但他们使用了webview，并使用了一些javascript ui库，如sencha。使用sencha框架可以很容易地实现。

我自己也玩过这个，我能找到的最好的方法是使用FrameLayout，并在菜单顶部放置一个自定义的HorizontalScrollView (HSV)。在HSV里面是你的应用程序视图，但有一个透明的视图作为第一个子视图。这意味着，当HSV有零滚动偏移时，菜单将显示(并且仍然是可点击的)。

当应用程序启动时，我们将HSV滚动到第一个可见应用程序视图的偏移量，当我们想要显示菜单时，我们向后滚动以通过透明视图显示菜单。

代码在这里，底部的两个按钮(称为HorzScrollWithListMenu和HorzScrollWithImageMenu)在启动活动中显示了我能想出的最好的菜单:

Android滑动菜单演示

模拟器截图(中间滚动):

来自设备的截图(全滚动)。注意，我的图标没有Facebook菜单图标宽，所以菜单视图和“应用程序”视图并不对齐。

我用AbsoluteLayout和一个简单的滑动控制器实现了这一点，它可以将视图移动到一个负偏移来隐藏。

如果有人感兴趣，我可以清理代码/布局和发布。我知道AbsoluteLayout被弃用了，但它是一个非常直接的实现。左视图/右视图，当“滑动打开”时，只需将左视图从- x偏移量移出到设备的宽度-任何你想显示的右视图

我在这个图书馆项目中实现了类似facebook的滑出导航

你可以很容易地将它构建到你的应用程序、UI和导航中。你只需要实现一个活动和一个片段，让库知道它-库将提供所有想要的动画和导航。

在repo中，你可以找到demo-project，以及如何使用库来实现类似facebook的导航。这是演示项目的短视频。

此外，这个库应该兼容这个ActionBar模式，因为它是基于Activities事务和TranslateAnimations(而不是Fragments事务和自定义视图)。

目前，最大的问题是如何让它在支持纵向和横向模式的应用程序中很好地工作。如果你有任何反馈，请通过github提供。

一切顺利，
亚历克斯< / p >

Facebook Android应用程序可能是用片段构建的。菜单是一个片段，深度活动(Newsfeed/Events/Friends等)是另一个片段。基本上是平板电脑的“master &手机上的细节布局。

对于信息，因为兼容性库开始1.6和这个facebook应用程序也运行在设备与Android 1.5，它不能用碎片。

你可以这样做: 创建一个“基础”活动BaseMenuActivity，你把所有的逻辑onItemClickListener的菜单列表和定义2个动画(“打开”和“关闭”)。 在动画的结束/开始，你显示/隐藏BaseMenuActivity的布局(让我们称之为menu_layout)。 这个活动的布局很简单，它只是一个带有项目的列表+列表右侧的透明部分。这个部分将是可点击的，它的宽度将与你的“移动按钮”宽度相同。这样，你就可以点击这个布局来启动动画，让content_layout向左滑动并占据整个屏幕。 对于每个选项(即菜单列表中的项)，你创建一个“ContentActivity”来扩展BaseMenuActivity。然后，当您单击列表中的一个项目时，您将使用可见的菜单启动ItemSelectedContentActivity(您将在活动启动时立即关闭该菜单)。 每个ContentActivity的布局是FrameLayout，包括和。你只需要移动content_layout，并在你想要的时候使menu_layout可见

这是一种方法，我希望我讲得够清楚了。

不能评论@Paul Grime给出的答案，无论如何，我已经在他的github项目上提交了闪烁问题的修复....

我会在这里发布修正，也许有人需要它。您只需要添加两行代码。动画下面的第一个。setAnimationListener电话:

anim.setFillAfter(true);

在app.layout()调用之后的第二个函数:

app.clearAnimation();

希望这对你有所帮助。

这里是另一个 lib，在我看来似乎是最好的。不是我写的。

更新:

这段代码似乎最适合我，它移动整个动作栏类似于G+应用程序。

谷歌是如何做到这一点的?在Android应用程序中滑动动作栏

我在过去的几天里一直在玩这个，我已经提出了一个解决方案，这是相当直接的，在pre-Honeycomb。我的解决方案是动画我想要滑动的视图(FrameLayout为我)，并监听动画的结束(在这一点上抵消视图的左/右位置)。我已经粘贴了我的解决方案:如何动画一个视图's翻译

我刚刚为我自己的项目实现了类似的视图。你可以检查它在这里

使用这个自定义视图作为XML布局的元素是很容易的。这里有一个例子:

    <shared.ui.actionscontentview.ActionsContentView
android:id="@+id/content"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:actions_layout="@layout/actions"
app:content_layout="@layout/content" />

如果你对ActionsContentView库的使用有任何疑问，我可以在项目Wiki上写一篇小文章。

这个库的一些优点:

• 通过触摸滑动视图的能力
• 在XML中很容易调整动作栏的大小
• 支持2.0及以上的所有Android SDK版本

但有一个限制:

• 所有水平滚动视图都不能在此视图的边界上工作

做了一个现有的实现的综述，并把它变成一个库项目加上示例应用程序。还添加了XML解析以及自动检测可能出现的动作栏，所以它与本机以及支持动作栏，如ActionBarSherlock。

这个也会滑动操作栏!

整个东西是一个库项目和一个示例应用程序，在一个滑动菜单的Android像谷歌和facebook应用程序中描述。感谢< >强热风< / >强提供最初的想法和代码!

经过几个小时的搜索，我发现保罗·格里姆的解决方案可能是最好的。但是它有太多的功能。因此，对于初学者来说，学习汉语可能很难。所以我想提供我的实现，它来自Paul的想法，但它更简单，应该更容易阅读。

实现侧菜单栏使用java代码没有XML

在2012年6月，谷歌在Eclipse ADT插件中添加了“模板”，并且有一个名为“master/detail flow”的模板，它正是这样做的(基于fragmets)。

这是简单而优雅的:https://github.com/akotoe/android-slide-out-menu.git

快照:

这里是另一个(非常好的)开源库!

它的优点是很容易与ActionBarSherlock集成。

下面是github项目链接

这是谷歌玩的下载链接

我在上面的回答中没有看到令人惊叹的SimonVT/android-menudrawer。这里有一个链接

https://github.com/SimonVT/android-menudrawer

它非常容易使用，你可以把它放在左边，右边，上面或下面。非常好的文档，包括示例代码和Apache 2.0许可证。

我想图书馆没有提到:

__abc0 / __abc1

github url:https://github.com/jfeinstein10/SlidingMenu

• 与动作栏ActionBarSherlock一起工作很好，这有助于向后兼容性!
• 支持正确的幻灯片和不仅滑动通过按钮!

1. 侧栏可以设置为任何位置:左，上，下，右
2. 主视图和滑动视图都是可点击的
3. 侧栏可以部分显示
4. 侧边栏的可样式属性更容易更改它的样式
5. maven回购中的神器
6. 一个大图书馆的一部分

源代码:https://github.com/serso/android-common/tree/master/views/src/main/java/org/solovyev/android/view/sidebar

用法:https://github.com/serso/android-common/blob/master/samples/res/layout/acl_view_layout.xml

你好，这是最好的示例演示应用程序，它提供了facebook一样的幻灯片 菜单。检查代码在这里

随着android支持包修订版13(2013年5月)，有了用于创建导航抽屉的DrawerLayout，可以从窗口边缘拉入。导航抽屉现在是一种设计模式。

v4支持库

导航抽屉设计模式

最近我在开发我的滑动菜单实现版本。它使用流行的J.Feinstein Android库SlidingMenu。

请在GitHub上查看源代码:

https://github.com/baruckis/Android-SlidingMenuImplementation

直接下载app到设备上尝试:

https://play.google.com/store/apps/details?id=com.baruckis.SlidingMenuImplementation

由于注释，代码应该是自解释的。希望对大家有所帮助!；）

Android增加了导航栏。请参考这个

link

下面是官方android文档中的设计和开发指南，不需要添加非官方的外部库。只有android支持库可以做到。在这里找到链接。

设计和开发。

我找到了一个最简单的方法。使用简单的导航抽屉并调用drawer. setdrawerlistner()，并在下面的drawerSlide方法中使用mainView.setX()方法或复制我的代码。

xml文件

 <android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#000000" >


<RelativeLayout
android:id="@+id/content_frame"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ffffff">


<ImageView
android:layout_width="40dp"
android:layout_height="40dp"
android:id="@+id/menu"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_marginTop="10dp"
android:layout_marginLeft="10dp"
android:src="@drawable/black_line"
/>
</RelativeLayout>




<RelativeLayout
android:id="@+id/left_drawer"
android:layout_width="200dp"
android:background="#181D21"
android:layout_height="match_parent"
android:layout_gravity="start"
>
</RelativeLayout>
</android.support.v4.widget.DrawerLayout>

java文件

   public class MainActivity extends AppCompatActivity {
DrawerLayout drawerLayout;
RelativeLayout mainView;
ImageView menu;


@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
menu=(ImageView)findViewById(R.id.menu);
drawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
mainView=(RelativeLayout)findViewById(R.id.content_frame);


menu.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
drawerLayout.openDrawer(Gravity.LEFT);
}
});


drawerLayout.setDrawerListener(new DrawerLayout.DrawerListener() {
@Override
public void onDrawerSlide(View drawerView, float slideOffset) {
mainView.setX(slideOffset * 300);
}


@Override
public void onDrawerOpened(View drawerView) {


}


@Override
public void onDrawerClosed(View drawerView) {


}


@Override
public void onDrawerStateChanged(int newState) {


}
});
}
}

谢谢你！