2015-11-07 51 views
2

我想创建导航抽屉效果,但不是从左侧滑出的抽屉,而是必须位于主视图“后面”,因此滑动的项目是视图本身(即右侧) - 抽屉根本不移动,但通过将主视图滑开来“展现”。手指滑动(并点击汉堡包图标)动作与抽屉相同,只是显示效果不同。Android移动主要内容以显示抽屉

方式的主要动作来看是一样的,以可以在这里

How to move main content with Drawer Layout left side

取得的成绩,但在我来说,我希望“抽屉”留静态主视图下方。

我已经通过覆盖视图并使抽屉透明达到了预期效果 - 当然这意味着抽屉不再用于导航;只是为了效果。在上述链路使用的代码

<FrameLayout 
xmlns:android="http://schemas.android.com/apk/res/android" 
android:id="@+id/whole_frame" 
android:layout_width="match_parent" 
android:layout_height="match_parent"> 

<!-- everything here is now the new "drawer" --> 
<TextView 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:textAppearance="?android:attr/textAppearanceLarge" 
    android:text="BOO I am hiding!" 
    android:id="@+id/tv2" 
    android:layout_gravity="left|top" /> 
<!-- /everything here is now the new "drawer" --> 

<android.support.v4.widget.DrawerLayout 

android:id="@+id/drawer_layout" 
android:layout_width="match_parent" 
android:layout_height="match_parent" 
> 

<!-- The This is the main content frame --> 
<FrameLayout 
    android:id="@+id/content_frame" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:background="@color/colorPrimary"> 

    <TextView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:textAppearance="?android:attr/textAppearanceLarge" 
     android:text="MOOOOOO!" 
     android:id="@+id/textView" 
     android:layout_gravity="left|top" /> 
</FrameLayout> 


<!-- The see-through navigation drawer --> 
<RelativeLayout 
    android:layout_width="280dp" 
    android:layout_height="match_parent" 
    android:id="@+id/left_drawer" 
    android:clickable="false" 
    android:background="@drawable/transparent_bg" <!-- #00FFFFFF --> 
    android:layout_gravity="start"> 

</RelativeLayout> 

</android.support.v4.widget.DrawerLayout> 

一切都是完美除了ID/TV2(或在该层上的其他项目)是无法点击被打开了“抽屉”时。

我已经试过:

1) 使上述不可点击(drawer_layout,content_frame和left_drawer setClickable(假)无效果)的布局。

2) 上述链接中的代码移动X轴上的content_frame而不是drawyer_layout - 我尝试移动drawer_layout而不是框架 - 这不能正常工作,因为您不能再点击最右侧再次关闭抽屉。

3) 将drawer_layout的android:layout_width更改为fill_parent,但这仍然是一个问题,因为它不是被移开的图层。

我的猜测是DrawerLayout(android.support.v4.widget.DrawerLayout)并不意味着在另一个布局之上,我可能需要创建自己的抽屉来达到理想的效果 - 任何想法或建议都会很棒。

回答

3

我相信我已经想出了一个相对简单的解决方案。以下DrawerLayout设置非常标准 - 即首先使用ViewGroup内容,抽屉View最后,使用标准属性等。另外,使用与您发布的链接中显示的技术类似的技术来将内容与抽屉一起滑动。

示例中的诀窍是抽屉本身的设置。我们将使用两个嵌套ViewGroup s - 外部是常规滑动抽屉View;内部,一个ViewGroup为实际的抽屉内容。然后我们使用DrawerListener(在我们的示例中为ActionBarDrawerToggle)将内部内容ViewGroup滑向与抽屉滑动方向相反的位置,使抽屉在左侧显示为静态。

示例DrawerLayout,main.xml。注意在drawer_containerViewGroup设置标准抽屉属性:

<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"> 

    <FrameLayout 
     android:id="@+id/main_content" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:background="#cccccc" /> 

    <FrameLayout 
     android:id="@+id/drawer_container" 
     android:layout_width="240dp" 
     android:layout_height="match_parent" 
     android:layout_gravity="start"> 

     <LinearLayout 
      android:id="@+id/drawer_content" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:orientation="vertical"> 

      <ImageView 
       android:id="@+id/image" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:layout_gravity="center_horizontal" 
       android:src="@drawable/ic_launcher" /> 

      ... 

     </LinearLayout> 

    </FrameLayout> 

</android.support.v4.widget.DrawerLayout> 

这个例子Activity表明我们需要添加到正规的抽屉式导航设置一些额外的线条。除了获取引用到View S后,主位在ActionBarDrawerToggleonDrawerSlide()方法:

public class MainActivity extends Activity { 

    ActionBarDrawerToggle toggle; 
    DrawerLayout drawerLayout; 
    View drawerContainer; 
    View drawerContent; 
    View mainContent; 

    @Override 
    protected void onCreate(Bundle savedInstanceState) { 
     super.onCreate(savedInstanceState); 
     setContentView(R.layout.main); 

     drawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout); 
     drawerContainer = findViewById(R.id.drawer_container); 
     drawerContent = findViewById(R.id.drawer_content); 
     mainContent = findViewById(R.id.main_content); 

     toggle = new ActionBarDrawerToggle(...) { 
      @Override 
      public void onDrawerSlide(View drawer, float slideOffset) { 
       super.onDrawerSlide(drawer, slideOffset); 

       drawerContent.setTranslationX(drawerContainer.getWidth() * (1 - slideOffset)); 
       mainContent.setTranslationX(drawerContainer.getWidth() * slideOffset); 
      } 
     }; 

     drawerLayout.addDrawerListener(toggle); 
    } 
} 

记住DrawerLayout恢复抽屉中Activity再创作打开/关闭状态,所以你可能需要以解决这个问题,例如,在方向改变时等。

+1

你的答案在很多方面都很棒,非常感谢! – mogoman

+1

没有汗水。这一个很有趣。干杯! –