如何像Redbus一样进行座位预定 [英] How to make seat booking layout like redbus
本文介绍了如何像Redbus一样进行座位预定的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我正在使用公交车预订应用程序，我想添加座位预订布局，例如在Red Bus App中.我使用GridView设计布局，但是看起来像
I am working on a bus booking app and I want to add seat booking layout like in the Red Bus App. I design layout using GridView but it looks like
我有什么 我想要的
我需要在座椅1和2之间的空间较小，然后在座椅2和3之间的空间较大，而在座椅3和4之间的空间分别为1和2.并且在最后一行中，我需要5个座椅.我需要和红色巴士的布局完全一样.
I need less space between Seat 1 and Seat 2 then big space between Seat 2 and 3 and again space between seat 3 and seat 4 as seat 1 and 2. And in last row i need 5 seats. I need exactly same as red bus layout.
XML
<RelativeLayout
android:id="@+id/seatLayoutLowerMain"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_below="@+id/seatLegendLayout"
android:layout_centerHorizontal="true"
android:layout_marginTop="10.0dip"
android:background="@drawable/seat_layout_border"
android:paddingBottom="5.0dp"
android:paddingRight="5.0dp" >
<GridView
android:id="@+id/gridView1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_below="@+id/driver"
android:layout_margin="4dp"
android:columnWidth="100dp"
android:gravity="center"
android:numColumns="5"
android:stretchMode="columnWidth" >
</GridView>
<RelativeLayout
android:id="@+id/driver"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignRight="@+id/gridView1"
android:layout_marginRight="20.0dp"
android:layout_marginTop="5.0dp"
android:background="@drawable/steering_icon"
android:orientation="horizontal" >
</RelativeLayout>
</RelativeLayout>
座位选择活动
public class SeatSelection extends AppCompatActivity implements AdapterView.OnItemClickListener{
GridView gridView;
ArrayList<Item> gridArray = new ArrayList<Item>();
CustomGridViewAdapter customGridAdapter;
public Bitmap seatIcon;
public Bitmap seatSelect;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_seat_selection);
seatIcon = BitmapFactory.decodeResource(this.getResources(), R.drawable.seat_layout_screen_nor_avl);
seatSelect = BitmapFactory.decodeResource(this.getResources(), R.drawable.seat_layout_screen_nor_std);
totalSeat(49);
gridView = (GridView) findViewById(R.id.gridView1);
customGridAdapter = new CustomGridViewAdapter(this, R.layout.seatrow_grid, gridArray);
gridView.setAdapter(customGridAdapter);
gridView.setOnItemClickListener(this);
}
public void totalSeat(int n)
{
for (int i = 1; i <= n; ++i)
{
gridArray.add(new Item(seatIcon, "Seat " + i));
}
}
public void seatSelected(int pos)
{
gridArray.remove(pos);
gridArray.add(pos, new Item(seatSelect, "Selected"));
customGridAdapter.notifyDataSetChanged();
}
public void seatDeselcted(int pos)
{
gridArray.remove(pos);
int i = pos + 1;
gridArray.add(pos, new Item(seatIcon, "Seat" + i));
customGridAdapter.notifyDataSetChanged();
}
@Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id)
{
Item item = gridArray.get(position);
Bitmap seatcompare = item.getImage();
if (seatcompare == seatIcon)
{
seatSelected(position);
}
else
{
seatDeselcted(position);
}
}
}
CustomGridViewAdapter
public class CustomGridViewAdapter extends ArrayAdapter<Item>
{
Context context;
int layoutResourceId;
ArrayList<Item> data = new ArrayList<Item>();
public CustomGridViewAdapter(Context context, int layoutResourceId, ArrayList<Item> data)
{
super(context, layoutResourceId, data);
this.layoutResourceId = layoutResourceId;
this.context = context;
this.data = data;
}
@Override
public View getView(int position, View convertView, ViewGroup parent)
{
View row = convertView;
RecordHolder holder = null;
try
{
if (row == null)
{
LayoutInflater inflater = ((Activity) context).getLayoutInflater();
row = inflater.inflate(layoutResourceId, parent, false);
holder = new RecordHolder();
holder.txtTitle = (TextView) row.findViewById(R.id.item_text);
holder.imageItem = (ImageView) row.findViewById(R.id.item_image);
row.setTag(holder);
}
else
{
holder = (RecordHolder) row.getTag();
}
Item item = data.get(position);
holder.txtTitle.setText(item.getTitle());
holder.imageItem.setImageBitmap(item.getImage());
} catch (Exception e)
{
e.printStackTrace();
}
return row;
}
public static class RecordHolder
{
public TextView txtTitle;
public ImageView imageItem;
}
}
推荐答案
您无需在此处使用gridview，而是可以结合使用线性布局和imageview来动态创建此视图.
You don't need to use a gridview here, instead you can dynamically create this view with the combinations of linear layout and imageview..
您可以在此处检查示例. https://github.com/varunjohn/Booking-Seats-Layout-Sample
You can check the sample here.. https://github.com/varunjohn/Booking-Seats-Layout-Sample
查看全文
