android gridview中嵌套progressbar

根据需求的要求：当收听过的歌曲，就会有播放进度。当正在收听过的歌曲，不仅有播放进度，同时有高亮动画。从来没有听过的歌曲，显示歌曲名称就可以。

那么为了对应进度，progressbar的样式定制很关键。。。

先亮出XML 布局：

Activity的布局：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#2c2255"
    tools:context=".MainActivity">
    <TextView
        android:id="@+id/tv"
        android:layout_width="1640px"
        android:layout_height="100px"
        android:background="#00ff00"
        android:layout_marginRight="100px"
        android:layout_alignParentRight="true"
        />
    <GridView
        android:layout_below="@id/tv"
        android:layout_alignParentRight="true"
        android:id="@+id/gridview"
        android:layout_width="1640px"
        android:layout_height="match_parent"
        android:columnWidth="380px"
        android:layout_marginRight="100px"
        android:verticalSpacing="74px"
        android:horizontalSpacing="40px"
        android:numColumns="4"
        android:stretchMode="columnWidth"
        android:gravity="center" />
</RelativeLayout>

单条GridView的布局：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="50dp"
    >
    <!--ImageView
        android:id="@+id/image"
        android:layout_width="match_parent"
        android:layout_height="99px"
        android:src="@drawable/listitem_bg"
        android:alpha="0.1"/>
    <ImageView
        android:id="@+id/image_progress"
        android:visibility="gone"
        android:layout_width="117px"
        android:layout_height="99px"
        android:src="@drawable/listitem_bg"
        android:alpha="0.07"/-->

    <ProgressBar
        android:id="@+id/pb_progressbar"
        style="@style/mProgressBarStyle"
        android:layout_width="match_parent"
        android:layout_height="100px"
        android:max="100" />
    <ProgressBar
        android:id="@+id/pb_listening_progressbar"
        android:visibility="gone"
        style="@style/mProgressBar_listeningStyle"
        android:layout_width="match_parent"
        android:layout_height="100px"
        android:max="100" />
    <TextView
        android:id="@+id/textView"
        android:layout_marginLeft="31px"
        android:layout_marginTop="20px"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:textSize="28px"
        android:textColor="#ffffff"
        android:typeface="normal"/>
    <TextView
        android:id="@+id/textView_time"
        android:layout_marginLeft="28px"
        android:layout_marginTop="59px"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:textSize="22px"
        android:textColor="#ffffff"
        android:alpha="0.4"
        android:text="03:22"
        android:typeface="normal"/>
    <com.example.recycler.AudioColumnView
        android:id="@+id/acv"
        android:visibility="gone"
        android:layout_marginLeft="26px"
        android:layout_marginTop="30px"
        android:layout_width="27px"
        android:layout_gravity="center_horizontal"
        android:background="@android:color/transparent"
        android:layout_height="26px"/>
</RelativeLayout>

mProgressBar_listeningStyle布局：

<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>
    <style name="mProgressBarStyle" parent="@android:style/Widget.ProgressBar.Horizontal">
        <item name="android:maxHeight">100px</item>
        <item name="android:minHeight">100px</item>
        <item name="android:progressDrawable">@drawable/progress_horizontal</item>
        <item name="android:indeterminateOnly">false</item>
        <item name="android:indeterminateDrawable">@android:drawable/progress_indeterminate_horizontal</item>
    </style>
    <style name="mProgressBar_listeningStyle" parent="@android:style/Widget.ProgressBar.Horizontal">
        <item name="android:maxHeight">100px</item>
        <item name="android:minHeight">100px</item>
        <item name="android:progressDrawable">@drawable/progress_horizontal_listening</item>
        <item name="android:indeterminateOnly">false</item>
        <item name="android:indeterminateDrawable">@android:drawable/progress_indeterminate_horizontal</item>
    </style>
</resources>

progress_horizontal.xml:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:id="@android:id/background">
        <shape>
            <corners android:radius="4px" />
            <solid android:color="#1Affffff"/>
        </shape>
    </item>
    <item android:id="@android:id/progress">
        <clip>
            <shape>
                <corners
                    android:bottomLeftRadius="4px"
                    android:bottomRightRadius="0px"
                    android:topLeftRadius="4px"
                    android:topRightRadius="0px"
                    />
                <solid android:color="#0Dffffff"/>
            </shape>
        </clip>
    </item>
</layer-list>

progress_horizontal_listening.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:id="@android:id/background">
        <shape>
            <corners android:radius="4px" />
            <gradient
                android:startColor="#169c4ff3"
                android:centerColor="#009c4ff3"
                android:endColor="#319c4ff3"
                android:angle="270"/>
        </shape>
    </item>
    <item android:id="@android:id/progress">
        <clip>
            <shape>
                <corners
                    android:bottomLeftRadius="4px"
                    android:bottomRightRadius="0px"
                    android:topLeftRadius="4px"
                    android:topRightRadius="0px"
                    />
                <gradient
                    android:startColor="#4c05dd"
                    android:centerColor="#9b44ff"
                    android:endColor="#cb81ff"
                    android:angle="270"/>
            </shape>
        </clip>
    </item>
</layer-list>

定义play_info类型的数据：

package com.example.recycler;

import androidx.annotation.NonNull;

import java.io.Serializable;

public class Playlist_Info implements Serializable {
    private String play_list_item_name;
    private String play_list_item_time;
    private int play_list_item_progress;
    private boolean is_Playing;

    public Playlist_Info(){
    }

    public Playlist_Info(String play_list_item_name,String play_list_item_time,int play_list_item_progress)
    {
        this.play_list_item_name = play_list_item_name;
        this.play_list_item_time = play_list_item_time;
        this.play_list_item_progress = play_list_item_progress;
    }

    public String get_item_name() {return play_list_item_name;}
    public void set_item_name(String play_list_item_name) {this.play_list_item_name = play_list_item_name;}

    public String get_item_time() {return play_list_item_time;}
    public void set_item_time(String play_list_item_time) {this.play_list_item_time = play_list_item_time;}

    public int get_item_progress() {return play_list_item_progress;}
    public void set_item_progress(int play_list_item_progress) {this.play_list_item_progress = play_list_item_progress;}

    public boolean isPlaying() {return is_Playing;}
    public void setIsPlaying(boolean is_playing){is_Playing = is_playing;}

    @NonNull
    @Override
    public String toString() {
        return "{" + "play_list_item_name='" + play_list_item_name + '\'' + ", play_list_item_time='" + play_list_item_time + '\'' + ", play_list_item_progress=" + play_list_item_progress + '}';
    }
}

GridViewAdapter.java

package com.example.recycler;

import android.content.Context;
import android.os.Handler;
import android.os.Message;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.ProgressBar;
import android.widget.RelativeLayout;
import android.widget.TextView;
import android.view.ViewGroup.LayoutParams;
import android.view.ViewGroup.MarginLayoutParams;
import com.example.recycler.AudioColumnView;

import java.util.ArrayList;
import java.util.List;
import java.util.Random;
import java.util.Timer;


public class GridViewAdapter extends BaseAdapter {
    private String log_tag = "GridViewAdapter";
    private int listening_index;
    private class GridHolder{
        //ImageView imgback;
        //ImageView imgprogress;
        TextView textview;
        TextView textview_time;
        AudioColumnView audioColumnView;
        ProgressBar pb_progressbar;
        ProgressBar pb_listening_progressbar;
    }
    private Context context;
    private List<Playlist_Info> listitem;

    public GridViewAdapter(Context context,List<Playlist_Info> listitem){
        this.context = context;
        this.listitem = listitem;
    }

    @Override
    public int getCount() {
        return listitem.size();
    }

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

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

    @Override
    public View getView(int position, View view, ViewGroup viewGroup) {
        GridHolder holder;

        if(view == null){
            view = LayoutInflater.from(context).inflate(R.layout.playlist_item,null);
            holder = new GridHolder();
            holder.pb_progressbar = view.findViewById(R.id.pb_progressbar);
            holder.pb_listening_progressbar=view.findViewById(R.id.pb_listening_progressbar);
            holder.textview = (TextView)view.findViewById(R.id.textView);
            holder.textview_time = (TextView)view.findViewById(R.id.textView_time);
            holder.audioColumnView = (AudioColumnView)view.findViewById(R.id.acv);
            view.setTag(holder);
        }
        else
        {
            holder = (GridHolder)view.getTag();
        }
        Playlist_Info info = listitem.get(position);
        if(info != null)
        {
            int text_left_margin = 0;
            if(position == 0)
            {
                text_left_margin = 19;
                holder.pb_progressbar.setProgress(38);
                holder.pb_listening_progressbar.setVisibility(View.GONE);
                holder.audioColumnView.setVisibility(View.GONE);
                holder.textview_time.setText("已听38%");
            }
            else if(position == 1)
            {
                text_left_margin = 67;
                holder.pb_listening_progressbar.setProgress(listitem.get(position).get_item_progress());
                holder.pb_progressbar.setVisibility(View.GONE);
                holder.pb_listening_progressbar.setVisibility(View.VISIBLE);
                holder.audioColumnView.setVisibility(View.VISIBLE);
                holder.textview_time.setText("已听38%");
            }
            else
            {
                text_left_margin = 26;
                holder.pb_progressbar.setProgress(0);
                holder.pb_progressbar.setVisibility(View.VISIBLE);
                holder.pb_listening_progressbar.setVisibility(View.GONE);

                holder.audioColumnView.setVisibility(View.GONE);
                holder.textview_time.setText( info.get_item_time());

            }
            Log.d(log_tag, String.valueOf(info.get_item_name().length()));
            //改变字体位置
            MarginLayoutParams marginLayoutParams_text = new MarginLayoutParams(holder.textview.getLayoutParams());
            marginLayoutParams_text.setMargins(text_left_margin,19,0,0);
            RelativeLayout.LayoutParams layoutParams_text = new RelativeLayout.LayoutParams(marginLayoutParams_text);
            holder.textview.setLayoutParams(layoutParams_text);
            holder.textview.setText( sub_string(info.get_item_name()));
        }
        return view;
    }

    String sub_string(String source_string)
    {
        String sub_string = "";
        if(source_string.length()<8)
        {
            sub_string = source_string;
        }
        else
        {
            sub_string=source_string.substring(0, 4)+"..."+source_string.substring(source_string.length() - 4);
        }
        return sub_string;
    }
}

MainActivity.java

package com.example.recycler;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
import android.os.SystemClock;
import android.view.View;
import android.view.Window;
import android.widget.AdapterView;
import android.widget.GridView;
import android.widget.ProgressBar;

import com.example.recycler.GridViewAdapter;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import java.util.Timer;
import java.util.TimerTask;

public class MainActivity extends AppCompatActivity {
    private GridView gridView;
    private GridViewAdapter adapter;
    private List<Playlist_Info> list;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        if (getSupportActionBar() != null){
            getSupportActionBar().hide();
        }
        gridView = (GridView)this.findViewById(R.id.gridview);
        list = new ArrayList<>();

        for(int i = 1; i < 21;i++)
        {
            if(2 == i)
            {
                list.add(new Playlist_Info("大江东区浪淘尽，千古风流人物","3:22",30));
                continue;
            }
            else
            {
                list.add(new Playlist_Info("精绝古城第"+String.valueOf(i)+"集","3:22",30));
            }
        }
        adapter = new GridViewAdapter(MainActivity.this,list);
        gridView.setAdapter(adapter);
        progress_bar(1);

    }
    public void publishProgress(final int positionInAdapter, final int progress_time) {
        list.get(positionInAdapter).set_item_progress(progress_time);
        if (positionInAdapter >= gridView.getFirstVisiblePosition() &&
                positionInAdapter <= gridView.getLastVisiblePosition()) {
            int positionInListView = positionInAdapter - gridView.getFirstVisiblePosition();
            ProgressBar item = (ProgressBar) gridView.getChildAt(positionInListView)
                    .findViewById(R.id.pb_listening_progressbar);
            item.setProgress(progress_time);
        }
    }
    private void progress_bar(final int positionInAdapter) {
        list.get(positionInAdapter).setIsPlaying(true);
        if (positionInAdapter >= gridView.getFirstVisiblePosition() &&
                positionInAdapter <= gridView.getLastVisiblePosition()) {
            int positionInListView = positionInAdapter - gridView.getFirstVisiblePosition();
            ProgressBar item_listening = (ProgressBar) gridView.getChildAt(positionInListView)
                    .findViewById(R.id.pb_listening_progressbar);
            item_listening.setVisibility(View.VISIBLE);
        }
        new Thread(new Runnable() {
            @Override
            public void run() {
                for (int i = 1; i < 101; i++) {
                    final int progress = i;
                    runOnUiThread(new Runnable() {
                        @Override
                        public void run() {
                            publishProgress(positionInAdapter, progress);
                        }
                    });
                    SystemClock.sleep(5000);
                }
            }
        }).start();
    }
}

效果图：

来源：https://www.cnblogs.com/wxmwanggood/p/11750779.html

标签

gridview

progressbar

android

string

info