我已经实现了从右侧滑动的抽屉布局，但它不会像 facebook 那样向右移动活动（见下图）。当用户点击上图中的 opendrawer 按钮时，如何将当前活动推到右侧。目前它出现在活动顶部并投下阴影。我非常感谢任何帮助。提前致谢。
问问题
28595 次
9 回答
69
虽然没有默认的方式来滑动 Activity 和导航抽屉，但我们可以通过代码来实现。正如 mick88 在上述答案中所建议的，以下是我项目中的代码片段。
我的 profile.xml 文件
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:facebook="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<!-- Framelayout to display Fragments -->
<RelativeLayout
android:id="@+id/mainView"
android:layout_width="match_parent"
android:layout_height="match_parent" >
</RelativeLayout>
<!-- Listview to display slider menu -->
<RelativeLayout
android:id="@+id/drawerView"
android:layout_width="240dp"
android:layout_height="wrap_content"
android:layout_gravity="start" >
<ListView
android:id="@+id/list_slidermenu"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/list_background"
android:divider="@color/list_divider"
android:dividerHeight="1dp" />
</RelativeLayout>
</android.support.v4.widget.DrawerLayout>
现在在活动中
public class ProfileActivity extends ActionBarActivity {
....
private DrawerLayout mDrawerLayout;
private ActionBarDrawerToggle mDrawerToggle;
RelativeLayout drawerView;
RelativeLayout mainView;
....
@Override
protected void onCreate(Bundle savedInstanceState) {
............. //
.............//
drawerView = (RelativeLayout) findViewById(R.id.drawerView);
mainView = (RelativeLayout) findViewById(R.id.mainView);
mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout, R.drawable.ic_drawer, R.string.app_name, R.string.app_name) {
public void onDrawerClosed(View view) {
supportInvalidateOptionsMenu();
}
public void onDrawerOpened(View drawerView) {
supportInvalidateOptionsMenu();
}
@Override
public void onDrawerSlide(View drawerView, float slideOffset) {
super.onDrawerSlide(drawerView, slideOffset);
mainView.setTranslationX(slideOffset * drawerView.getWidth());
mDrawerLayout.bringChildToFront(drawerView);
mDrawerLayout.requestLayout();
}
};
mDrawerLayout.setDrawerListener(mDrawerToggle);
}
}
于 2014-07-02T07:17:12.120 回答
26
不建议这样做，但您可以以编程方式移动布局：
@Override
public void onDrawerSlide(View drawerView, float offset) {
View container = findViewById(R.id.container);
container.setTranslationX(offset * drawerView.getWidth());
}
于 2014-06-24T09:08:10.787 回答
9
我不认为你可以用 stock 来实现它DrawerLayout，但是SlidingMenu你可以，这里的 GitHub repo 应该解释你需要的一切
于 2013-10-24T22:17:39.410 回答
9
回答你的问题。DrawerLayout 的行为符合预期。
您可以将 Slidingmenu （或Umano）与 DrawerLayout 结合使用（我愿意）。
最后，关于你想要什么（以及 Facebook 做什么），谷歌本身并不希望你这样做。他们希望您像在 Google 音乐中那样使用抽屉（例如）
一位 Google 联系人对我这么说：
所以不要像 Facebook 那样做。（这在任何其他情况下都是一个很好的建议）:)
于 2013-10-24T23:21:29.453 回答
7
这真的很有帮助。将此代码段放入您的 MainActivity.java
ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(this, drawerLayout, toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close) {
@Override
public void onDrawerSlide(View drawerView, float slideOffset) {
super.onDrawerSlide(drawerView, slideOffset);
containerFrame.setTranslationX(slideOffset * drawerView.getWidth());
drawerLayout.bringChildToFront(drawerView);
drawerLayout.requestLayout();
//below line used to remove shadow of drawer
drawerLayout.setScrimColor(Color.TRANSPARENT);
}//this method helps you to aside menu drawer
};
于 2016-09-20T06:55:26.350 回答
1
MainActivity.java
public class MainActivity extends AppCompatActivity
implements NavigationView.OnNavigationItemSelectedListener {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar toolbar = findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
final CoordinatorLayout content = findViewById(R.id.clMain);
DrawerLayout drawer = findViewById(R.id.drawer_layout);
NavigationView navigationView = findViewById(R.id.nav_view);
ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(this, drawer, toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close) {
private float scaleFactor = 4f;
@Override
public void onDrawerSlide(View drawerView, float slideOffset) {
super.onDrawerSlide(drawerView, slideOffset);
float slideX = drawerView.getWidth() * slideOffset;
content.setTranslationX(slideX);
content.setScaleX(1 - (slideOffset / scaleFactor));
content.setScaleY(1 - (slideOffset / scaleFactor));
}
};
drawer.setScrimColor(Color.TRANSPARENT);
drawer.setDrawerElevation(0f);
drawer.addDrawerListener(toggle);
toggle.syncState();
navigationView.setNavigationItemSelectedListener(this);
}
@Override
public void onBackPressed() {
DrawerLayout drawer = findViewById(R.id.drawer_layout);
if (drawer.isDrawerOpen(GravityCompat.START)) {
drawer.closeDrawer(GravityCompat.START);
} else {
super.onBackPressed();
}
}
@SuppressWarnings("StatementWithEmptyBody")
@Override
public boolean onNavigationItemSelected(MenuItem item) {
int id = item.getItemId();
DrawerLayout drawer = findViewById(R.id.drawer_layout);
drawer.closeDrawer(GravityCompat.START);
return true;
}
}
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:background="@color/colorPrimary"
tools:openDrawer="start">
<include
layout="@layout/app_bar_main"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<android.support.design.widget.NavigationView
android:id="@+id/nav_view"
android:layout_width="150dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:fitsSystemWindows="true"
android:background="@color/colorPrimary"
app:headerLayout="@layout/nav_header_main"
app:menu="@menu/activity_main_drawer" />
</android.support.v4.widget.DrawerLayout>
app_bar_main.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/clMain"
tools:context=".MainActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="@style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<include layout="@layout/content_main" />
</android.support.design.widget.CoordinatorLayout>
content_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/container"
android:background="@android:color/white"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
tools:context=".MainActivity"
tools:showIn="@layout/app_bar_main">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello World!"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</LinearLayout>
于 2019-04-25T06:51:01.280 回答
1
OP得到了答案。但是对于想要这种效果的其他人，可以使用SlidingPaneLayout。它是为此目的而设计的。
在 XML 文件中：
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.SlidingPaneLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@id/mainFrame"
style="@style/MP.mainFrame" >
<!--****************************Right Pane ****************************-->
<LinearLayout style="@style/searchLayout">
<android.support.v4.widget.NestedScrollView style="@style/MP">
<LinearLayout style="@style/MP.verticalLinearLayout">
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
</LinearLayout>
<!--****************************Right Pane ****************************-->
<!--****************************Left Pane ****************************-->
<FrameLayout style="@style/MP.mainLayout">
<LinearLayout android:id="@id/fragmentContainer" style="@style/MP.fragmentContainer"/>
<android.support.v7.widget.Toolbar style="@style/toolbar">
<ir.tooskar.excomponents.ExtendedTextView android:id="@id/appTitle" style="@style/WC.appTitle"/>
<ir.tooskar.excomponents.ExtendedTextView android:id="@id/appBarSearchIcon" style="@style/WC.appBarSearchIcon"/>
</android.support.v7.widget.Toolbar>
</FrameLayout> <!--****************************Left Pane ****************************-->
有两个窗格，左右，粘在一起，因此一起移动。对我来说，左侧窗格是主窗格，右侧隐藏了一个切换图标来显示它。（ID为 appBarSearchIcon的视图）。
请记住，有一个名为SlidingPaneLayout的视图组，它只有两个子项，即 The Left和 The Right。
活动中的重要部分：
slidingPaneLayout = (SlidingPaneLayout) findViewById(R.id.mainFrame);
// Sets a color for covering left pane(Main Pane)
slidingPaneLayout.setSliderFadeColor(ContextCompat.getColor(context, R.color.searchPaneFadeColor));
// The listener for Opening the Right pane(Hidden pane)
findViewById(R.id.appBarSearchIcon).setOnClickListener(new OnClickListener() {
@Override
public void onClick(View view){
slidingPaneLayout.openPane();
}
});
关闭右窗格由 API 完成，就像 Navigation Drawer 一样。
于 2017-07-23T07:56:54.220 回答
1
于 2021-07-16T04:28:17.300 回答
0
ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(this, drawer, toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close) {
private float scaleFactor = 4f;
@Override
public void onDrawerSlide(View drawerView, float slideOffset) {
super.onDrawerSlide(drawerView, slideOffset);
float slideX = drawerView.getWidth() * slideOffset;
content.setTranslationX(slideX);
content.setScaleX(1 - (slideOffset / scaleFactor));
content.setScaleY(1 - (slideOffset / scaleFactor));
}
};
于 2019-05-18T11:24:07.170 回答