导言:
很多人都喜欢使用安卓的listview进行列表式的展示,然而列表项的内容往往不是一个单一的textview,可能是很多复杂的组件组合,该篇旨在帮助大家了解,如何制作自定义的listview item 并且实现item中组件的监听和值传递。
样例:
我们这次主要实现了一个类似于酒店预订展示的界面,采用listview布局,每个item由图片、按钮、各条文字组成
首先我们需要两个layout
1.activity_order_results.xml 存放列表展示的底板
2.activity_order_results_item.xml 定义列表项组件的底板
接着我们需要编写一个OrderResultsActivity.java 的activity来控制第一个layout文件
最后需要编写一个OrderResultsAdapter.java 来定义每个列表项组件的adapter
代码:
1.activity_room_results.xml 放置了一个ListView组件
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"android:layout_width="match_parent"
android:layout_height="match_parent">
<ListView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/listView"
android:layout_gravity="center_horizontal"/>
</LinearLayout>
2.activity_order_results_item.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="10dp">
<ImageView
android:layout_width="135dp"
android:layout_height="115dp"
android:id="@+id/hotelPicture"
android:background="@mipmap/room_example"
android:layout_marginTop="8dp"
android:layout_marginLeft="8dp"/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="1">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hotel Name"
android:textSize="17sp"
android:textStyle="bold"
android:textColor="@color/abc_input_method_navigation_guard"
android:layout_marginLeft="5dp"
android:id="@+id/hotelNameText"/>
<RatingBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:numStars="5"
style="?android:attr/ratingBarStyleSmall"
android:layout_marginLeft="10dp"
android:layout_gravity="center"
android:id="@+id/ratingBar"
android:stepSize="0.1"/>
</LinearLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hotel Location la la la"
android:layout_marginTop="5dp"
android:layout_marginLeft="5dp"
android:id="@+id/hotelLocationText"
android:textSize="14sp"/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="512$"
android:layout_marginLeft="5dp"
android:layout_marginTop="5dp"
android:textSize="14sp"
android:editable="false"
android:textColor="@color/bright_foreground_disabled_material_light"
android:id="@+id/originPrice"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="487$"
android:layout_marginLeft="5dp"
android:layout_marginTop="5dp"
android:textSize="18sp"
android:editable="false"
android:textColor="@color/material_deep_teal_500"
android:textStyle="bold"
android:id="@+id/currentPrice"/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
android:layout_width="wrap_content"
android:layout_height="35dp"
android:text="Order Now"
android:textSize="10sp"
android:layout_marginTop="5dp"
android:layout_marginLeft="5dp"
android:background="@drawable/round_button_orange"
android:textColor="@color/abc_primary_text_disable_only_material_dark"
android:id="@+id/orderNowButton"/>
<Button
android:layout_width="wrap_content"
android:layout_height="35dp"
android:layout_marginLeft="10dp"
android:text="More Details"
android:textSize="10sp"
android:layout_marginTop="5dp"
android:background="@drawable/round_button_green"
android:textColor="@color/abc_primary_text_disable_only_material_dark"
android:id="@+id/decideButton"/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
3. OrderResultsAdapter.java 自定义控制item组件的adapter
public classOrderResultsAdapterextendsBaseAdapter {
privateArrayListmData;
privateContextmContext;
publicOrderResultsAdapter(ArrayList mData,Context mContext){
this.mData=mData;
this.mContext=mContext;
}
@Override
public intgetCount() {
returnmData.size();
}
@Override
publicObject getItem(intposition) {
return null;
}
@Override
public longgetItemId(intposition) {
returnposition;
}
@Override
publicView getView(final intposition, View convertView, ViewGroup parent) {
if(convertView ==null){
convertView = LayoutInflater.from(mContext).inflate(R.layout.activity_order_results_item,parent,false);
}
//初始化item的各个组件
finalImageView imageView1=(ImageView)convertView.findViewById(R.id.hotelPicture);
finalTextView originPrice=(TextView)convertView.findViewById(R.id.originPrice);
originPrice.getPaint().setFlags(Paint.STRIKE_THRU_TEXT_FLAG);
originPrice.setText(mData.get(position).getOriginPrice()+"");
finalTextView currentPrice=(TextView)convertView.findViewById(R.id.currentPrice);
currentPrice.setText(mData.get(position).getCurrentPrice()+"");
finalTextView hotelName=(TextView) convertView.findViewById(R.id.hotelNameText);
hotelName.setText(mData.get(position).getName());
finalTextView hotelLocation=(TextView) convertView.findViewById(R.id.hotelLocationText);
hotelLocation.setText(mData.get(position).getLocation());
Button orderNowButton=(Button)convertView.findViewById(R.id.orderNowButton);
Button decideButton=(Button)convertView.findViewById(R.id.decideButton);
imageView1.setBackgroundResource(R.mipmap.timg1);
RatingBar ratingBar=(RatingBar)convertView.findViewById(R.id.ratingBar);
ratingBar.setRating((float)mData.get(position).getPoints());
//设置按钮的监听,实现点击后跳转到酒店详细内容的界面,并且传递数据
decideButton.setOnClickListener(newView.OnClickListener() {
@Override
public voidonClick(View v) {
//使用bundle和intent实现界面间数据传递
if(true){
Intent intent=newIntent(mContext,RoomResultsDetailActivity.class);
Bundle b =newBundle();
b.putString("hotelName",hotelName.getText().toString());
b.putString("originPrice",originPrice.getText().toString());
b.putString("currentPrice",currentPrice.getText().toString());
b.putString("hotelLocation",hotelLocation.getText().toString());
b.putString("nego",negoString);
intent.putExtras(b);
mContext.startActivity(intent);
}
}
});
returnconvertView;
}
}
4. OrderResultsActivity
public classOrderResultsActivity extends AppCompatActivityimplementsAdapterView.OnItemClickListener{
privateListViewmListView;
privateArrayListmList;
privateMediaPlayermp;
@Override
public voidonCreate(Bundle savedInstanceState){
super.onCreate(savedInstanceState);
setToolBarTitle("Order Results");
mp=MediaPlayer.create(OrderResultsActivity.this,R.raw.hotel_reserve_result);
getSubTitle().setText("Tips");
getSubTitle().setOnClickListener(newView.OnClickListener() {
@Override
public voidonClick(View v) {
mp.start();
}
});
mListView=(ListView)findViewById(R.id.listView);
Resources res=this.getResources();
mList=newArrayList();
//初始化data
ArrayList tags=newArrayList<>();
OrderResultsEntity orderResultsEntity1=newOrderResultsEntity(255,230,"0.19km away from the destination","Lingnanjiayuan Chain Hotel",3.42,tags);
OrderResultsEntity orderResultsEntity2=newOrderResultsEntity(250,235,"0.31km away from the destination","Jiaxin Hotel",3.76,tags);
OrderResultsEntity orderResultsEntity3=newOrderResultsEntity(180,160,"0.22km away from the destination","Jiayu Hotel",4.11,tags);
OrderResultsEntity orderResultsEntity4=newOrderResultsEntity(198,162,"0.28km away from the destination","Inn De Hotel",4.74,tags);
OrderResultsEntity orderResultsEntity5=newOrderResultsEntity(260,240,"0.38km away from the destination","Wong Kim Dinh Hotel",3.21,tags);
mList.add(orderResultsEntity4);
mList.add(orderResultsEntity3);
mList.add(orderResultsEntity2);
mList.add(orderResultsEntity1);
mList.add(orderResultsEntity5);
OrderResultsAdapter orderResultsAdapter=newOrderResultsAdapter(mList,OrderResultsActivity.this);
mListView.setAdapter(orderResultsAdapter);
}
@Override
protected intgetLayoutId() {
returnR.layout.activity_order_results;
}
@Override
public voidonItemClick(AdapterView parent, View view,intposition,longid){
Toast.makeText(OrderResultsActivity.this,"你点击了第"+ position +"项",Toast.LENGTH_SHORT).show();
Intent intent=newIntent();
intent.setClass(OrderResultsActivity.this,RoomResultsDetailActivity.class);
startActivity(intent);
}
}
5.最后可以自己写一下订单的实体,定义你所需要的实体属性