android studio仿写一个美团主页面
时间: 2023-07-20 20:45:25 浏览: 154
Android Studio 模仿美团界面
好的,下面是实现步骤:
1. 创建一个新项目,取名为"MeiTuan",选择空活动模板。
2. 在app目录下的build.gradle文件中添加以下依赖:
```
implementation 'com.google.android.material:material:1.2.0'
implementation 'com.android.support:recyclerview-v7:28.0.0'
implementation 'com.android.support:cardview-v7:28.0.0'
implementation 'com.squareup.picasso:picasso:2.71828'
```
另外,由于美团的主页是一个垂直滚动的列表,因此我们需要在build.gradle文件中添加以下依赖:
```
implementation 'androidx.recyclerview:recyclerview:1.1.0'
implementation 'com.android.support:recyclerview-v7:28.0.0'
```
3. 在layout目录下创建一个名为"item_category.xml"的布局文件,用于显示美团主页的分类项。
4. 在layout目录下创建一个名为"item_shop.xml"的布局文件,用于显示美团主页的商家信息。
5. 在layout目录下创建一个名为"activity_main.xml"的布局文件,用于显示整个美团主页。
6. 在MainActivity中实现数据的初始化和RecyclerView的设置。
代码示例:
```
public class MainActivity extends AppCompatActivity {
private RecyclerView mRecyclerView;
private List<Category> mCategoryList = new ArrayList<>();
private List<Shop> mShopList = new ArrayList<>();
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initData();
mRecyclerView = findViewById(R.id.recycler_view);
mRecyclerView.setLayoutManager(new LinearLayoutManager(this));
mRecyclerView.setAdapter(new ShopAdapter(mCategoryList, mShopList));
}
private void initData() {
// 初始化分类项
mCategoryList.add(new Category("美食"));
mCategoryList.add(new Category("电影"));
mCategoryList.add(new Category("酒店"));
mCategoryList.add(new Category("休闲娱乐"));
mCategoryList.add(new Category("外卖"));
mCategoryList.add(new Category("KTV"));
mCategoryList.add(new Category("周边游"));
// 初始化商家信息
mShopList.add(new Shop(R.drawable.shop1, "麦当劳", "4.5", "20元起送 | 30分钟送达"));
mShopList.add(new Shop(R.drawable.shop2, "肯德基", "4.6", "25元起送 | 40分钟送达"));
mShopList.add(new Shop(R.drawable.shop3, "必胜客", "4.7", "30元起送 | 50分钟送达"));
mShopList.add(new Shop(R.drawable.shop4, "星巴克", "4.8", "35元起送 | 60分钟送达"));
mShopList.add(new Shop(R.drawable.shop5, "华莱士", "4.3", "15元起送 | 25分钟送达"));
mShopList.add(new Shop(R.drawable.shop6, "呷哺呷哺", "4.2", "18元起送 | 28分钟送达"));
mShopList.add(new Shop(R.drawable.shop7, "满记甜品", "4.1", "12元起送 | 20分钟送达"));
mShopList.add(new Shop(R.drawable.shop8, "必胜客", "4.7", "30元起送 | 50分钟送达"));
mShopList.add(new Shop(R.drawable.shop9, "麦当劳", "4.5", "20元起送 | 30分钟送达"));
mShopList.add(new Shop(R.drawable.shop10, "肯德基", "4.6", "25元起送 | 40分钟送达"));
}
}
```
7. 创建一个ShopAdapter类,用于将分类项和商家信息显示在RecyclerView上。
代码示例:
```
public class ShopAdapter extends RecyclerView.Adapter<RecyclerView.ViewHolder> {
private List<Category> mCategoryList;
private List<Shop> mShopList;
public ShopAdapter(List<Category> categoryList, List<Shop> shopList) {
mCategoryList = categoryList;
mShopList = shopList;
}
@Override
public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
if (viewType == 0) {
View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_category, parent, false);
return new CategoryViewHolder(view);
} else {
View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_shop, parent, false);
return new ShopViewHolder(view);
}
}
@Override
public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) {
if (holder instanceof CategoryViewHolder) {
CategoryViewHolder viewHolder = (CategoryViewHolder) holder;
viewHolder.mTextView.setText(mCategoryList.get(position / 2).getName());
} else {
ShopViewHolder viewHolder = (ShopViewHolder) holder;
Shop shop = mShopList.get((position - 1) / 2);
viewHolder.mImageView.setImageResource(shop.getImageResId());
viewHolder.mNameTextView.setText(shop.getName());
viewHolder.mRatingTextView.setText(shop.getRating());
viewHolder.mDeliveryTextView.setText(shop.getDelivery());
}
}
@Override
public int getItemCount() {
return mCategoryList.size() * 2 - 1 + mShopList.size();
}
@Override
public int getItemViewType(int position) {
if (position % 2 == 0) {
return 0;
} else {
return 1;
}
}
private static class CategoryViewHolder extends RecyclerView.ViewHolder {
private TextView mTextView;
private CategoryViewHolder(View itemView) {
super(itemView);
mTextView = itemView.findViewById(R.id.text_view);
}
}
private static class ShopViewHolder extends RecyclerView.ViewHolder {
private ImageView mImageView;
private TextView mNameTextView;
private TextView mRatingTextView;
private TextView mDeliveryTextView;
private ShopViewHolder(View itemView) {
super(itemView);
mImageView = itemView.findViewById(R.id.image_view);
mNameTextView = itemView.findViewById(R.id.name_text_view);
mRatingTextView = itemView.findViewById(R.id.rating_text_view);
mDeliveryTextView = itemView.findViewById(R.id.delivery_text_view);
}
}
}
```
8. 将美食、电影、酒店等分类项和商家信息的图片、名称、评分、起送价、配送时间等数据替换成您自己的数据。
9. 运行程序,即可看到仿写的美团主页。
以上就是仿写美团主页的实现步骤,希望能对您有所帮助!
阅读全文