用补间动画的水平滚动的菜单栏 [英] Horizontal-Scrollable menu bar with tweening animation

问题描述

我想建立它由一个按钮和一个菜单栏的自定义UI组件。

I wanted to build a custom UI component which consist of a button and a menu bar.

在单击该按钮，该按钮将补间从屏幕上移开，然后选择菜单栏将缓动了，这一菜单栏是建立一组图标水平滚动。这样的例子就像是，你选择从滚动条想要的类型新闻福克斯新闻应用程序。如所示<一个href=\"http://stackoverflow.com/questions/5701785/android-scrollable-menu-bar-like-fox-news-app\">here.

When the button is clicked, the button will tween away from the screen, then the menu bar will tween in. The menu bar is built a set of icons scrollable horizontally. Such example is like the Fox News app where you select the type news you want from the scroll bar. Such as shown here.

另一个例子是在App思维空间，当上了菜单键和绘图工具栏用户点击来了。我到底需要显示在这个程序。

Another example is on the app Thinking Space, when user click on the menu button and the drawing toolbar comes up. I need exactly shown on this app.

我读过关于构建从Android的页面自定义UI组件的几个导游，但还没有拿到上我应该从哪里开始的线索。我是否需要通过扩展View类完全从头开始建立？如果是这样，我该如何实现补间动画，我不知道应该在的onDraw（）绘制方法作为栏和按钮将不会同时出现在屏幕上。

I've read several guides on building a custom UI component from android's page but have not yet got a clue on where should I start. Do I need to completely build from scratch by extending View class? If it's so, how do I implement the tweening animation, I do not know which should be drawn in onDraw() method as the bar and the button will not both appear on the screen.

任何意见或例子来指导我的光？这是我第一次建立自定义UI组件。

Any advice or example to guide me to the light? It's my first time building custom UI components.

我会提供更多的信息，你帮我，如果需要的话。

I'll provide more information for you to help me, if needed.

非常感谢你！

推荐答案

你考虑使用Tabhost，并在每则tabspec，使用这将包含您的菜单中Horizo​​ntalScrollView

did you think about using Tabhost , and in each Tabspec , use an HorizontalScrollView which will contains your menu

？那是你要的吗 ？

在你的布局XML：

<!-- scroll des pays de filtre -->
    <HorizontalScrollView android:layout_width="fill_parent"
        android:layout_height="wrap_content" android:layout_alignParentTop="true"
        android:id="@+id/scrollPays">

        <LinearLayout android:layout_height="wrap_content"
            android:layout_width="fill_parent" android:id="@+id/layoutScrollPays"
            android:orientation="horizontal">

            <Button android:id="@+id/filtrePaysPromo" android:layout_width="wrap_content"
                android:textStyle="bold" android:textSize="17px" android:textColor="#fafafa" 
                android:layout_height="wrap_content" android:background="@drawable/segment"
                android:text="Promo" android:padding="2px"
                android:layout_gravity="center"/>

            <Button android:id="@+id/filtrePaysMaroc" android:layout_width="wrap_content"
                android:layout_height="wrap_content" android:background="@drawable/segment"
                android:text="Maroc" android:textSize="17px" android:textColor="#fafafa" 
                android:padding="2px" android:layout_gravity="center" />

            <Button android:id="@+id/filtrePaysTunisie" android:layout_width="wrap_content"
                android:layout_height="wrap_content" android:background="@drawable/segment"
                android:text="Tunisie" android:textSize="17px" android:textColor="#fafafa" 
                android:padding="2px" android:layout_gravity="center"/>

            <Button android:id="@+id/filtrePaysEspagne" android:layout_width="wrap_content"
                android:layout_height="wrap_content" android:background="@drawable/segment"
                android:text="Espagne" android:textSize="17px" android:textColor="#fafafa" 
                android:padding="2px" android:layout_gravity="center"/>

            <Button android:id="@+id/filtrePaysTurquie" android:layout_width="wrap_content"
                android:layout_height="wrap_content" android:background="@drawable/segment"
                android:text="Turquie" android:textSize="17px" android:textColor="#fafafa" 
                android:padding="2px" android:layout_gravity="center"/>

            <Button android:id="@+id/filtrePaysGrece" android:layout_width="wrap_content"
                android:layout_height="wrap_content" android:background="@drawable/segment"
                android:text="Grece" android:textSize="17px" android:textColor="#fafafa" 
                android:padding="2px" android:layout_gravity="center"/>

            <Button android:id="@+id/filtrePaysMaurice" android:layout_width="wrap_content"
                android:layout_height="wrap_content" android:background="@drawable/segment"
                android:text="Ile Maurice" android:textSize="17px" android:textColor="#fafafa" 
                android:padding="2px" android:layout_gravity="center"/>

            <Button android:id="@+id/filtrePaysRepDom" android:layout_width="wrap_content"
                android:layout_height="wrap_content" android:background="@drawable/segment"
                android:text="Rep. Dominicaine" android:textSize="17px" 
                android:textColor="#fafafa" android:padding="2px" android:layout_gravity="center"/>

            <Button android:id="@+id/filtrePaysItalie" android:layout_width="wrap_content"
                android:layout_height="wrap_content" android:background="@drawable/segment"
                android:text="Italie" android:textSize="17px" android:textColor="#fafafa" 
                android:padding="2px" android:layout_gravity="center"/>

            <Button android:id="@+id/filtrePaysEgypt" android:layout_width="wrap_content"
                android:layout_height="wrap_content" android:background="@drawable/segment"
                android:text="Egypt" android:textSize="17px" android:textColor="#fafafa" 
                android:padding="2px" android:layout_gravity="center"/>
        </LinearLayout>
    </HorizontalScrollView>

这是为我工作，
它看起来像这样：

that's work for me , it looks like this :

这篇关于用补间动画的水平滚动的菜单栏的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！