Bố cục Android với ListView và Buttons


101

Được rồi, bố cục cụ thể này chỉ làm tôi khó chịu. Và dường như không thể tìm ra cách để có một listView, với một hàng nút ở dưới cùng để chế độ xem danh sách không kéo dài qua đầu các nút, và do đó các nút luôn được đặt ở cuối màn hình. Đây là những gì tôi muốn:

đã xóa liên kết ImageShack chết

Có vẻ như nó sẽ dễ dàng như vậy, nhưng mọi thứ tôi đã thử đều thất bại. Bất kỳ giúp đỡ?

Đây là mã hiện tại của tôi:

    RelativeLayout container = new RelativeLayout(this);
    container.setLayoutParams(new RelativeLayout.LayoutParams(LayoutParams.FILL_PARENT,LayoutParams.FILL_PARENT));

    //** Add LinearLayout with button(s)

    LinearLayout buttons = new LinearLayout(this);

    RelativeLayout.LayoutParams bottomNavParams = new RelativeLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
    bottomNavParams.addRule(RelativeLayout.ALIGN_PARENT_BOTTOM);
    bottomNavParams.addRule(RelativeLayout.CENTER_HORIZONTAL);
    buttons.setLayoutParams(bottomNavParams);


    ImageButton newLayer = new ImageButton(this);
    newLayer.setImageResource(R.drawable.newlayer);
    newLayer.setLayoutParams(new LinearLayout.LayoutParams(45, LayoutParams.FILL_PARENT));
    buttons.addView(newLayer);

    container.addView(buttons);

    //** Add ListView

    layerview = new ListView(this);

    RelativeLayout.LayoutParams listParams = new RelativeLayout.LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT);
    listParams.addRule(RelativeLayout.ABOVE, buttons.getId());

    layerview.setLayoutParams(listParams);

    container.addView(layerview);

Câu hỏi hay, rất nhiều nhà phát triển sẽ gặp khó khăn về vấn đề này.
Signcodeindie

Rất may, trình thiết kế trong Android thực sự khá ngọt ngào. Do đó, khi tạo bố cục / giao diện người dùng, hãy cố gắng sử dụng Trình thiết kế / XML. Đặc biệt là đối với trường hợp này vì nó chỉ đơn thuần là một tập hợp các nút và một ListView.
Subby

Câu trả lời:


137

Tôi nghĩ rằng đây là những gì bạn đang tìm kiếm.

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

    <Button android:layout_width="fill_parent"
        android:layout_height="wrap_content" android:id="@+id/testbutton"
        android:text="@string/hello" android:layout_alignParentBottom="true" />

    <ListView android:layout_width="fill_parent"
        android:layout_height="fill_parent" android:id="@+id/list"
        android:layout_alignParentTop="true" android:layout_above="@id/testbutton" />

</RelativeLayout>

Đó là những gì về cơ bản tôi đang sử dụng, mặc dù tôi đang viết bố cục bằng Java. ListView vẫn mở rộng trên các nút.
Kleptine

1
Điều duy nhất tôi đang thay đổi là tôi đang thêm một relativeLayout xung quanh ListView vì tôi không thể gọi addRule (RelativeLayout.ABOVE) trên một ListView.
Kleptine

2
Mã này sẽ hoạt động tốt. android:layout_above="@id/testbutton"sẽ giữ ListViewở trên Button.
CommonsWare

Khi tôi sử dụng điều này, tôi nhận được danh sách dừng phía trên nút và sau đó bắt đầu cuộn bên trong.
lars

7
Bạn cũng không gọi addRule(RelativeLayout.ABOVE)trên a RelativeLayout. Bạn gọi nó trên a RelativeLayout.LayoutParams. Sau đó, bạn thêm cái ListViewvào RelativeLayout, cung cấp cái đó RelativeLayout.LayoutParams. Vui lòng xem xét chuyển sang XML và thổi phồng nó, để có thể bảo trì lâu dài.
CommonsWare

57

Tôi đã có cùng một vấn đề cho nhiều tuổi.

Giải pháp để giữ ListView bên trên các nút, nhưng ngăn nó che chúng khi danh sách dài, là đặt android: layout_weight = "1.0" trên ListView. Không đặt layout_weight trên các nút để chúng vẫn ở kích thước tự nhiên, nếu không các nút sẽ bị thu nhỏ. Điều này hoạt động với LinearLayout.

Có một ví dụ trong ApiDemos của Android: ApiDemos / res / layout / linear_layout_9.xml


chỉ tiết kiệm cho tôi một vài giờ nữa. Không thể hiểu tại sao các nút không bao giờ xuất hiện. :)
frostymarvelous

Tôi không hoàn toàn hiểu được lý do tại sao các công trình này, nhưng nó hoạt động :)
Bevor

20

Tôi chỉ đang tìm kiếm câu trả lời cho câu hỏi này và đây là một trong những kết quả đầu tiên. Tôi cảm thấy như thể tất cả các câu trả lời, bao gồm cả câu trả lời hiện được chọn là "câu trả lời hay nhất" không giải quyết được vấn đề đang được hỏi. Vấn đề đang được nêu ra là có sự chồng chéo của hai thành phần ButtonListViewtrong đó ListView đang chiếm toàn bộ màn hình và Nút trực quan nổi phía trên (phía trước) ListView (chặn chế độ xem / truy cập cuối cùng mục trongListView )

Dựa trên các câu trả lời tôi đã thấy ở đây và trên các diễn đàn khác, cuối cùng tôi đã đưa ra kết luận về cách giải quyết vấn đề này.

Ban đầu, tôi có:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:orientation="vertical"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
  android:background="#FF394952">

  <ListView
    android:id="@+id/game_list"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentTop="true"
    />

  <LinearLayout
    android:orientation="horizontal"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    style="@android:style/ButtonBar">

    <Button
      android:id="@+id/new_game"
      android:layout_width="fill_parent"
      android:layout_height="wrap_content"
      android:text="@string/new_game"
      android:textColor="#FFFFFFFF"
      android:background="@drawable/button_background" />
  </LinearLayout>

</RelativeLayout>

Lưu ý việc sử dụng RelativeLayout làm nút gốc.

Đây là phiên bản cuối cùng, hoạt động trong đó Nút không chồng lên ListView:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:orientation="vertical"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
  android:background="#FF394952">

  <ListView
    android:id="@+id/game_list"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentTop="true"
    android:layout_weight="1.0" />

  <LinearLayout
    android:orientation="horizontal"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    style="@android:style/ButtonBar">

    <Button
      android:id="@+id/new_game"
      android:layout_width="fill_parent"
      android:layout_height="wrap_content"
      android:text="@string/new_game"
      android:textColor="#FFFFFFFF"
      android:background="@drawable/button_background" />
  </LinearLayout>

</LinearLayout>

Chỉ có hai điểm khác biệt. Đầu tiên, tôi đã chuyển sang sử dụng một LinearLayout. Điều này sẽ giúp ích cho phần tiếp theo, đã thêm android:layout_weightvàoListView

Tôi hi vọng cái này giúp được.


Điều này giải quyết được, nhưng ai có thể đoán được !? Khi bạn cung cấp android:layout_alignParentBottombên trong một LinearLayoutphụ huynh, ADT cho biết "Tham số bố cục không hợp lệ trong LinearLayout: layout_alignParentBottom"!
Aswin Kumar

8

Cách tốt nhất là một bố cục tương đối đặt các nút bên dưới dạng xem danh sách. Trong ví dụ này, các nút cũng có bố cục tuyến tính vì dễ dàng đặt chúng cạnh nhau với kích thước bằng nhau.

<RelativeLayout android:id="@+id/RelativeLayout01" 
android:layout_width="fill_parent" 
android:layout_height="fill_parent">

<ListView android:id="@+id/ListView01" 
android:layout_alignParentTop="true"
android:layout_width="fill_parent" 
android:layout_height="fill_parent">
</ListView>

<LinearLayout android:id="@+id/LinearLayout01" 
android:layout_below="@+id/ListView01" 
android:layout_width="fill_parent" 
android:layout_height="wrap_content" 
android:layout_alignParentBottom="true">
<Button android:id="@+id/ButtonJoin" 
android:text="Join"
android:layout_width="fill_parent" 
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_alignParentBottom="true">
</Button>
<Button android:id="@+id/ButtonJoin" 
android:layout_alignRight="@id/ButtonCancel" 
android:layout_width="fill_parent" 
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Cancel"
android:layout_alignParentBottom="true">
</Button>
</LinearLayout>

</RelativeLayout>

Tuy nhiên, vấn đề là nó kéo dài trên đầu các Nút ở dưới cùng nếu chế độ xem danh sách quá dài. Tôi không thể tìm ra cách làm cho nó dừng lại phía trên các nút.
Kleptine

2
Nếu bạn đang sử dụng (tôi nghĩ là 1.5, thậm chí có thể là 1.6), bạn PHẢI có các nút TRƯỚC ListView khi sử dụng quy tắc RelativeLayout - nếu không, bố cục chưa biết về các Nút vì nó đọc chúng theo thứ tự, đó là lý do tại sao ListView của bạn mở rộng vượt qua chúng.
Tim H

Điều này không làm việc cho tôi. Giống như Tim H nói, đối với tôi, tôi phải đặt ListView sau LinearLayout và sau đó tạo ListView layout_above, giống như câu trả lời của repoc ở trên.
Nemi

công việc này sẽ không, các nút không được trên màn hình, và sẽ không cuộn
Vaibhav Mishra

1

Tôi biết bài đăng này khá cũ, nhưng, để trả lời câu hỏi của người đăng ban đầu, lý do mã không hoạt động là button.getId () trả về -1. Nếu bạn định làm điều này, bạn cần thiết lập thực hiện một cái gì đó như gọi button.setId (10). Nếu bạn làm điều đó, mã hoạt động tốt.


0

điều này sẽ hoạt động. để có các nút phía trên chế độ xem danh sách, hãy đặt các nút bên trong một bố cục tuyến tính khác.

<LinearLayout> main container // vertical

<LinearLayout> scrollview must be contained in a linear layout //vertical - height to fill parent

    <ScrollView> set the height of this to fill parent

        <ListView> will be contained in the scrollview
        </ListView>

    </ScrollView>

</LinearLayout>

<LinearLayout> //horizontal - height to wrap content

<Button>

</Button>

</LinearLayout>

</LinearLayout>

0

giải pháp đơn giản nhất sẽ là tạo hai bố cục tuyến tính, một với nút và một với chế độ xem danh sách (Bao bọc nội dung trên chiều cao của nút và khớp với cha mẹ trên chiều cao của bố cục danh sách). sau đó chỉ thực hiện chế độ xem cuộn trên bố cục với chế độ xem danh sách và bố cục nút sẽ bị bỏ qua. hy vọng nó sẽ giúp, xin lỗi tôi không cảm thấy muốn viết ra mã.

Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.