android - Android-如何创建类似于市场或Shopsavvy的UI

最近，Android市场和购物狂对UI进行了大修。结果是列表似乎在带有按钮的弯曲顶部区域下滑动。顶部似乎在列表上投下了阴影，并且列表本身与其余列表具有不同的标题。这对android UI的外观而言确实是一个很大的改进，外观更加专业。

那么，如何在带有投影的弯曲顶部下方滑动呢？

谢谢你们

最佳答案

开发者在开发市场应用程序时撰写了一篇很棒的博客文章，您可以在这里找到它http://www.pushing-pixels.org/2010/12/13/meet-the-green-goblin-part-1.html

在shopsavvy，我们采取了一种简单得多的方法，并获得了大致相同的结果。我们使用框架布局和两个彼此重叠的子布局。顶部布局具有作为背景的自定义图像，其中包括阴影(我们有一个很棒的图形专家)。底部布局只是一个列表 View ，其顶部有一个边距可将其放置在我们想要的位置。它的伪代码如下所示。

 <FrameLayout>
    <!-- Listview that sits under another view -->
    <LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >

         <ListView
           android:id="@+id/backgroundlist"
           android:layout_marginTop="150dp"
           android:layout_height="fill_parent"
           android:layout_width="fill_parent" />

     </LinearLayout>

     <!-- view that sits on top -->
     <LinearLayout
       android:layout_height="wrap_content"
       android:layout_width="fill_parent"
       android:background="@drawable/curvedimage"
       android:orientation="vertical"
      >
        <!-- headers, buttons and other stuff -->
        <LinearLayout
          .....

     </LinearLayout>
</FrameLayout>

对于列表 View 的标题，您只需在列表 View 上使用addHeaderView函数。您只需为所需的标题进行布局。在本例中，我们仅使用具有不同背景色的文本 View 。

<TextView
    xmlns:android="http://schemas.android.com/apk/res/android"

    android:text="@string/scans_right_now"
    android:layout_height="61dp"
    android:layout_width="fill_parent"
    android:gravity="bottom|center_horizontal"

    android:paddingBottom="3dp"

    android:textColor="#8b8b8b"
    android:background="#d3d3d3"
    android:textStyle="bold"

    android:shadowColor="#FFFFFF"
    android:shadowDx="0.0"
    android:shadowDy="1.0"
    android:shadowRadius="1.0" />

然后将该 View 添加为 Activity 内部的标题，如下所示:

ListView list = (ListView) findViewById(R.id.backgroundlist);
View recentScansHeader =        getLayoutInflater().inflate(R.layout.recent_products_header, recentViewList, false);
list.addHeaderView(recentScansHeader);