【Android studio】某易云歌曲热门榜单简单设计

运行效果/文件路径:

代码实现:

  • AndroidManifest.xml:
  在<application> ... </application>中添加↓
<activity
    android:name=".MainActivity"
    android:exported="true">
    <intent-filter>
        <action android:name="android.intent.action.MAIN" />

        <category android:name="android.intent.category.LAUNCHER" />
    </intent-filter>
</activity>
  • MainActivity.java:
package com.example.a5_hong_ge_1108;

import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.view.LayoutInflater;
import android.view.ViewGroup;
import android.widget.AdapterView;
import android.widget.BaseAdapter;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.ListView;
import android.widget.TextView;
import android.content.Context;
import android.content.res.TypedArray;
import java.util.ArrayList;
import java.util.HashMap;

public class MainActivity extends AppCompatActivity {
    private ListView listv;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        listv = (ListView) this.findViewById(R.id.ListView02);  //初始化ListView
        MyAdapter BAdapter = new MyAdapter(this);//得到一个MyAdapter对象
        //BaseAdapter:基础数据适配器,主要用途是将一组数据传到例如ListView等UI显示组件,继承自接口类Adapter。
        listv.setAdapter(BAdapter);  //为ListView绑定Adapter

        // 为ListView的每一个item添加点击事件的监听器
        listv.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> arg0, View arg1, int arg2, long arg3) {
                setTitle("点击了ListView的第 "+(arg2+1)+" 条目" );   //在标题栏中输出点击条目信息
            }
        });
    }

    // 获得数据的方法
    private ArrayList<HashMap<String, String>> getDate() {

        //所有img资源名的数组
        TypedArray imagesArray = getResources().obtainTypedArray(R.array.images);
        //所有name资源名的数组
        String[] names = getResources().getStringArray(R.array.names);
        //所有writer资源名的数组
        String[] writers = getResources().getStringArray(R.array.writers);

        ArrayList<HashMap<String, String>> listItem = new ArrayList<HashMap<String, String>>();

        // 为动态数组添加数据
        for (int i = 0; i < names.length; i++) {
            HashMap<String, String> map = new HashMap<String, String>();
            map.put("ItemImg", String.valueOf(imagesArray.getResourceId(i,0)));
            map.put("ItemName", names[i]);
            map.put("ItemWriter", writers[i]);
            listItem.add(map);
        }
        return listItem;
    }

    // 定义ViewHolder类,存放控件
    private final class ViewHolder {
        private ImageView img;
        private TextView name;
        private TextView writer;
        private Button btn;
    }

    // 定义 BaseAdapter适配器的子类
    private class MyAdapter extends BaseAdapter {
        private LayoutInflater mInflater;   //声明一个LayoutInfalter对象用来导入布局 //将布局XML文件实例化为其相应的View对象。
        private final ArrayList<HashMap<String, String>> datas;  //声明HashMap类型的数组

        // 构造函数
        public MyAdapter(Context context) {
            this.mInflater = LayoutInflater.from(context);
            this.datas=getDate();  //为HashMap类型的数组赋初值
        }

        @Override
        public int getCount() {
            return datas.size();//返回数组的长度
        }

        @Override
        public Object getItem(int position) {
            return datas.get(position);
        }

        @Override
        public long getItemId(int position) {
            return position;
        }

        /**
         * 动态生成每个下拉项对应的View。每个下拉项View由LinearLayout中包含一个ImageView,
         * 两个内嵌的LinearLayout构成,其中一个包含两个TextView,另一个中包含一个按钮
         **/
        @Override
        public View getView( int position, View convertView, ViewGroup parent) {
            ViewHolder holder;

            if (convertView == null) {
                convertView = mInflater.inflate(R.layout.listitem,null);
                holder = new ViewHolder();
                // 得到各个控件的对象
                holder.img=(ImageView) convertView.findViewById(R.id.itemimg);
                holder.name = (TextView) convertView.findViewById(R.id.itemname);
                holder.writer = (TextView) convertView.findViewById(R.id.itemwriter);
                holder.btn = (Button) convertView.findViewById(R.id.btn_heart);
                convertView.setTag(holder);//绑定ViewHolder对象
            } else {
                holder = (ViewHolder) convertView.getTag();//取出ViewHolder对象
            }
            HashMap<String, String> map=datas.get(position);

            //设置TextView显示的内容,即我们存放在动态数组中的数据
            holder.img.setImageResource(Integer.parseInt(map.get("ItemImg")));
            holder.name.setText(map.get("ItemName"));
            holder.writer.setText(map.get("ItemWriter"));
            //为Button添加点击事件
            holder.btn.setSelected(false);
            holder.btn.setTag(String.valueOf(position));
            holder.btn.setOnClickListener(new View.OnClickListener(){
                        @Override
                        public void onClick(View v) {
                            v.setSelected(!v.isSelected());
                        }
                    });
            return convertView;
        }
    }

}
  • res/drawable/head.xml:

      实现点击心后变红心

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/like2" android:state_selected="true"/>
    <item android:drawable="@drawable/like1" android:state_selected="false"/>
</selector>
  • res/layout/activity_main.xml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/LinearLayout01"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:background="@drawable/bj"
    >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:background="#59000000"
        android:gravity="center"
        >
        <TextView android:id="@+id/itemname"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="@color/white"
            android:text="2023某易云歌曲热门榜单"
            android:textSize="23sp" />
    </LinearLayout>

    <ListView
        android:id="@+id/ListView02"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        />
</LinearLayout>
  • res/layout/listitem.xml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:background="#4D000000"
    android:weightSum="6"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:id="@+id/itemimg"
        android:layout_width="65dp"
        android:layout_height="65dp"
        android:layout_margin="5dp"/>
    <!--与父容器相距的距离 前后左右5dp-->

    <LinearLayout
        android:orientation="vertical"
        android:layout_weight="6"
        android:layout_marginLeft="2dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">
        <TextView
            android:id="@+id/itemname"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="@color/white"
            android:textSize="20sp" />
        <TextView
            android:id="@+id/itemwriter"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="@color/white"
            android:textSize="13sp" />
    </LinearLayout>

    <android.widget.Button
        android:id="@+id/btn_heart"
        android:layout_width="30dp"
        android:layout_height="30dp"
        android:layout_marginLeft="10dp"
        android:layout_marginTop="6dp"
        android:background="@drawable/heart"
        />
    <android.widget.Button
        android:id="@+id/btn_fenxiang"
        android:layout_width="30dp"
        android:layout_height="30dp"
        android:layout_marginLeft="5dp"
        android:layout_marginTop="6dp"
        android:background="@drawable/fx"
        />
    <android.widget.Button
        android:id="@+id/btn_qita"
        android:layout_width="30dp"
        android:layout_height="30dp"
        android:layout_marginLeft="5dp"
        android:layout_marginTop="6dp"
        android:background="@drawable/qita"
        />

</LinearLayout>
  • res/values/arrays.xml:
<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string-array name="images">
        <item>@drawable/ge1</item>
        <item>@drawable/ge2</item>
        <item>@drawable/ge3</item>
        <item>@drawable/ge4</item>
        <item>@drawable/ge5</item>
        <item>@drawable/ge6</item>
    </string-array>

    <string-array name="names">
        <item>@string/ge1_name</item>
        <item>@string/ge2_name</item>
        <item>@string/ge3_name</item>
        <item>@string/ge4_name</item>
        <item>@string/ge5_name</item>
        <item>@string/ge6_name</item>
    </string-array>

    <string-array name="writers">
        <item>@string/ge1_writer</item>
        <item>@string/ge2_writer</item>
        <item>@string/ge3_writer</item>
        <item>@string/ge4_writer</item>
        <item>@string/ge5_writer</item>
        <item>@string/ge6_writer</item>
    </string-array>
</resources>
  • res/values/colors.xml:
<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="colorPrimary">#6200EE</color>
    <color name="colorPrimaryDark">#3700B3</color>
    <color name="colorAccent">#03DAC5</color>

    <color name="white">#FFFFFFFF</color>
    <color name="red">#FFFD8D8D</color>
    <color name="blue">#0628f5</color>
    <color name="black">#000000</color>
    <color name="grey">#7F7F7F</color>
</resources>
  • res/values/strings.xml:
<resources>
    <string name="app_name">A5_hong_ge_1108</string>

    <string name="ge1_name">如果明天不会到来</string>
    <string name="ge2_name">一棵会开花的树(live)</string>
    <string name="ge3_name">送一朵愧疚的花</string>
    <string name="ge4_name">海(the sea)</string>
    <string name="ge5_name">100 days</string>
    <string name="ge6_name">苏东坡</string>

    <string name="ge1_writer">陈小熊-之外</string>
    <string name="ge2_writer">谢春花-2019谢春花「花语时」北京演唱会实录</string>
    <string name="ge3_writer">房东的猫-送一朵愧疚的花</string>
    <string name="ge4_writer">房东的猫-这是你想要的生活吗</string>
    <string name="ge5_writer">房东的猫-Song to Doggy</string>
    <string name="ge6_writer">司南-苏东坡</string>
</resources>

如果我没有少什么的话,将对应图片的名字补上,应该是能运行的,也是好久没用了,这几天突发奇想想做一些总结(念旧?哈哈哈哈哈哈)

  • 10
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

青鱼鱼

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值