Android 固定 Header 的列表片段

Android List Fragment with fixed Header

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="fill_parent"
    android:layout_height="100dip"
    android:padding="6dip" >

    <ImageView
        android:id="@+id/img_icon"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_alignParentBottom="true"
        android:layout_alignParentTop="true"
        android:layout_marginRight="6dip"
        android:contentDescription="Image" />

    <TextView
        android:id="@+id/txtNome"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true"
        android:layout_toRightOf="@+id/img_icon"
        android:textSize="12sp"
        android:gravity="top"
        android:text="Nome" />

    <TextView
        android:id="@+id/txtPreco"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:ellipsize="marquee"
        android:layout_toRightOf="@+id/img_icon"
        android:layout_below="@+id/txtNome"
        android:textSize="12sp"
        android:text="Preço" />

    <TextView
        android:id="@+id/txtQtde"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:textSize="12sp"
        android:text="Qtde"
        android:layout_below="@+id/txtPreco"
        android:layout_toRightOf="@+id/img_icon" />

    <TextView
        android:id="@+id/txtTotal"
        android:layout_width="fill_parent"
        android:layout_height="26dip"
        android:textSize="12sp"
        android:text="Total"
        android:layout_alignParentBottom="true"
        android:layout_toRightOf="@+id/img_icon"
        android:layout_below="@+id/txtQtde" />

</RelativeLayout>

大家好!

我有一个带有自定义适配器的 FragmentList,这个适配器有一些 TextViews 和 Imageviews...一切正常,但是,我正在尝试添加一个 Header(一个带有按钮的布局)和一个页脚(带有一些 Textview 和一个 ImageView 的布局)。 我希望 Header 和页脚不随列表向下滚动,但它们确实... 有人可以帮我吗?下面是打印和代码...

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {

    mAdapter = new PedidoAdapter(getContext(), (Pedido)((MainActivity) getActivity()).pedido);

    setListAdapter(mAdapter);

    // Inflate the layout for this fragment
    return super.onCreateView(inflater, container, savedInstanceState);
}

@Override
public void onViewCreated(View view, Bundle savedInstance){
    super.onViewCreated(view, savedInstance);

    StyleSpan bssLabel = new StyleSpan(Typeface.BOLD);
    StyleSpan bssText = new StyleSpan(Typeface.NORMAL);

    SimpleDateFormat sdf = new SimpleDateFormat("dd/MM/yyyy HH:mm:ss");
    String Data = String.valueOf(sdf.format(((MainActivity) getActivity()).pedido.getDataPedido()));

    String _dataPedido = "Data Pedido.: " + Data;
    SpannableStringBuilder sbDataPedido = new SpannableStringBuilder(_dataPedido);
    sbDataPedido.setSpan(bssLabel, 0, 14, Spanned.SPAN_INCLUSIVE_INCLUSIVE);
    sbDataPedido.setSpan(bssText, 14, _dataPedido.length(), Spanned.SPAN_INCLUSIVE_INCLUSIVE);

    String _status = "Status.: " + String.valueOf(((MainActivity) getActivity()).pedido.getStatusPedido());
    SpannableStringBuilder sbStatus = new SpannableStringBuilder(_status);
    sbStatus.setSpan(bssLabel, 0, 9, Spanned.SPAN_INCLUSIVE_INCLUSIVE);
    sbStatus.setSpan(bssText, 8, _status.length(), Spanned.SPAN_INCLUSIVE_INCLUSIVE);

    float total = 0;

    for(int i = 0; i < ((MainActivity) getActivity()).pedido.getItens().size(); i++){
        total += ((MainActivity) getActivity()).pedido.getItens().get(i).getQtde() * ((MainActivity) getActivity()).pedido.getItens().get(i).getProduto().getValor();
    }

    for(int i = 0; i < ((MainActivity) getActivity()).pedido.getPizzas().size(); i++){
        total += ((MainActivity) getActivity()).pedido.getPizzas().get(i).getQtde() * ((MainActivity) getActivity()).pedido.getPizzas().get(i).getPizza().getValor();
    }

    String _total = "Total.: R$ " + String.valueOf(total);
    SpannableStringBuilder sbTotal = new SpannableStringBuilder(_total);
    sbTotal.setSpan(bssLabel, 0, 7, Spanned.SPAN_INCLUSIVE_INCLUSIVE);
    sbTotal.setSpan(bssText, 8, _total.length(), Spanned.SPAN_INCLUSIVE_INCLUSIVE);

    View footer = LayoutInflater.from(getContext()).inflate(R.layout.listview_pedido_footer_layout, null, false);

    ((TextView) footer.findViewById(R.id.txtDataPedido)).setText(sbDataPedido);
    ((TextView)footer.findViewById(R.id.txtStatusPedido)).setText(sbStatus);
    ((TextView)footer.findViewById(R.id.txtTotalPedido)).setText(sbTotal);

    View header = LayoutInflater.from(getContext()).inflate(R.layout.listview_pedido_header_layout, null, false);

    getListView().addHeaderView(header);
    getListView().addFooterView(footer);
}

席尔瓦请试试这个布局:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <!-- Header aligned to the top -->
    <RelativeLayout
        android:id="@+id/header"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:background="#FC9"
        android:gravity="center" >

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="5dp"
            android:text="Fixed Header"
            android:textColor="#000"
            android:textSize="20sp" />
    </RelativeLayout>

    <!-- Footer aligned to the bottom -->
    <RelativeLayout
        android:id="@+id/footer"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:background="#FC0"
        android:gravity="center" >

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="5dp"
            android:text="Fixed Footer"
            android:textColor="#000"
            android:textSize="20sp" />
    </RelativeLayout>

    <!-- Scrollable Item below header and above footer -->
    <ScrollView
        android:id="@+id/scrollableContents"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_above="@id/footer"
        android:background="#005"
        android:layout_below="@id/header" >

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:gravity="center_horizontal"
            android:orientation="vertical" >

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginBottom="22dp"
                android:layout_marginTop="22dp"
                android:text="Item 1"
                android:textColor="#CCCCCC"
                android:textSize="19sp" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginBottom="22dp"
                android:layout_marginTop="22dp"
                android:text="Item 2"
                android:textColor="#CCCCCC"
                android:textSize="19sp" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginBottom="22dp"
                android:layout_marginTop="22dp"
                android:text="Item 3"
                android:textColor="#CCCCCC"
                android:textSize="19sp" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginBottom="22dp"
                android:layout_marginTop="22dp"
                android:text="Item 4"
                android:textColor="#CCCCCC"
                android:textSize="19sp" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginBottom="22dp"
                android:layout_marginTop="22dp"
                android:text="Item 5"
                android:textColor="#CCCCCC"
                android:textSize="19sp" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginBottom="22dp"
                android:layout_marginTop="22dp"
                android:text="Item 6"
                android:textColor="#CCCCCC"
                android:textSize="19sp" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginBottom="22dp"
                android:layout_marginTop="22dp"
                android:text="Item 7"
                android:textColor="#CCCCCC"
                android:textSize="19sp" />

        </LinearLayout>

    </ScrollView>

</RelativeLayout>

此 Android 工作室项目可在此处获得 https://github.com/m-vahidalizadeh/fixed-header-footer.git,您可以克隆它以查看结果。


如果你想动态地做,你应该使用自定义数组适配器(http://developer.android.com/reference/android/widget/ArrayAdapter.html)。然后,按照这个:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:tools="http://schemas.android.com/tools"
  android:layout_width="match_parent"
  android:layout_height="match_parent" >

  <!-- Header aligned to top -->
  <RelativeLayout
    android:id="@+id/header"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentTop="true"
    android:background="#FC9"
    android:gravity="center" >

    <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_margin="5dp"
      android:text="Fixed Header"
      android:textColor="#000"
      android:textSize="20sp" />
  </RelativeLayout>

  <!-- Footer aligned to bottom -->
  <RelativeLayout
    android:id="@+id/footer"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:background="#FC0"
    android:gravity="center" >

    <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_margin="5dp"
      android:text="Fixed Footer"
      android:textColor="#000"
      android:textSize="20sp" />
  </RelativeLayout>

  <!-- Scrollable Item below header and above footer -->
  <ScrollView
    android:id="@+id/scrollableContents"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:layout_above="@id/footer"
    android:background="#005"
    android:layout_below="@id/header" >

     <!-- Inflate the contents of the ScrollView dynamicaly -->

  </ScrollView>

</RelativeLayout>

您可以这样添加您的项目:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center_horizontal"
    android:orientation="vertical" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="22dp"
        android:layout_marginTop="22dp"
        android:text="Item 1"
        android:textColor="#CCCCCC"
        android:textSize="19sp" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="22dp"
        android:layout_marginTop="22dp"
        android:text="Item 2"
        android:textColor="#CCCCCC"
        android:textSize="19sp" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="22dp"
        android:layout_marginTop="22dp"
        android:text="Item 3"
        android:textColor="#CCCCCC"
        android:textSize="19sp" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="22dp"
        android:layout_marginTop="22dp"
        android:text="Item 4"
        android:textColor="#CCCCCC"
        android:textSize="19sp" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="22dp"
        android:layout_marginTop="22dp"
        android:text="Item 5"
        android:textColor="#CCCCCC"
        android:textSize="19sp" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="22dp"
        android:layout_marginTop="22dp"
        android:text="Item 6"
        android:textColor="#CCCCCC"
        android:textSize="19sp" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="22dp"
        android:layout_marginTop="22dp"
        android:text="Item 7"
        android:textColor="#CCCCCC"
        android:textSize="19sp" />

</LinearLayout>

然后,您应该像这样将您的内容填充到中间的 ScrollView 中:

import android.app.Activity;
import android.os.Bundle;
import android.widget.ScrollView;

public class MainActivity extends Activity {

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

        ScrollView scrollable_contents = (ScrollView) findViewById(R.id.scrollableContents);
        getLayoutInflater().inflate(R.layout.contents, scrollable_contents);

    }

}

希望对您有所帮助:)