如何将带有音频文件的 Android 专辑转换为 HTML？答案

【问题标题】：How to get Android Album with audio files to HTML?如何将带有音频文件的 Android 专辑转换为 HTML？
【发布时间】：2019-04-04 03:11:26
【问题描述】：

我正在尝试列出一个标签以按专辑过滤。我设法在另一个选项卡“全部”中显示所有音频文件。

我确实设法使用 MediaStore.Audio.AudioColumns.ALBUM 显示专辑名称。如果一张专辑有 5 首歌曲，它将填充 5 个专辑名称。

如何将它们组合在一起并作为“文件夹”单击并显示在音频项目中？

我在 Android Studio 中获取专辑名称的代码：


public ArrayList<AudioModel> getAllAudioFromDevice (Context context){
        final ArrayList<AudioModel> tempAudioList = new ArrayList<>();

        Uri uri = MediaStore.Audio.Media.EXTERNAL_CONTENT_URI;
        String[] projection = {
                MediaStore.Audio.AudioColumns.DATA,
                MediaStore.Audio.AudioColumns.TITLE,
                MediaStore.Audio.AudioColumns.ALBUM,
                MediaStore.Audio.ArtistColumns.ARTIST,
                MediaStore.Audio.AudioColumns.DURATION,
        };

        Cursor c = context.getContentResolver().query(uri, projection, null, null, null);

        if (c != null) {
            while (c.moveToNext()) {
                AudioModel audioModel = new AudioModel();
                String path = c.getString(0); // Retrieve path.
                String name = c.getString(1); // Retrieve name.
                String album = c.getString(2); // Retrieve album name.
                String artist = c.getString(3); // Retrieve artist name.
                String duration = c.getString(4); // Retrieve duration.

                audioModel.setaName(name);
                audioModel.setaAlbum(album);
                audioModel.setaArtist(artist);
                audioModel.setaPath(path);
                audioModel.setaDuration(duration);

                tempAudioList.add(audioModel);

            }
            c.close();
        }

        return tempAudioList;

    }

我在 Android Studio 的 JavascriptInterface 代码：

@JavascriptInterface
        public String getmp3album(){
            ArrayList<AudioModel> allMp3 = getAudioAlbumFromDevice(this.activity);
            List<AudioModel> listStrings = new ArrayList<>(allMp3);

            String tempAlbum= "";

            for (int i = 0; i < listStrings.size(); i++) {

                String AudioAlbum = listStrings.get(i).aAlbum;

                    tempAlbum += AudioAlbum + ",";

            }

            return tempAlbum;
        }

我的 HTML index.html 侧代码：

<div id="albumwrap">
                <ul id="albumlist"></ul>
            </div>

我在 index.html 中的 Javascript 代码：

function showAlbumList(){

    var stringAlbum = window.AndroidFunction.getmp3album();
    var arrayAlbum = stringAlbum.split(",");


    var select = document.getElementById('albumlist');        

    for (var i = 0; i < arrayAlbum.length; i++) {

        var li = document.createElement("li");             
        li.setAttribute('class', 'plItem');

        var link = document.createElement("a");            
        link.setAttribute('class', 'plTitle');
        link.setAttribute('href', arrayAlbum[i]);           
        li.appendChild(link);                               
        var text = document.createTextNode(arrayAlbum[i]);
        link.appendChild(text);                            

        select.insertBefore(li, select.childNodes[i]);
    }
}
window.onLoad = showAlbumList();

现在显示：专辑1 专辑1 专辑1 专辑2 专辑2

预期： +专辑1 -歌曲1 -歌曲2 -歌曲3 +专辑2 -歌曲1 -歌曲2

【问题讨论】：

标签： javascript android html

【解决方案1】：

如果您使用的是 webview，那么您可以将其替换为富文本视图：https://github.com/square1-io/rich-text-android

然后使用上面的库，并设置“setOnSpanClickedObserver”得到想要的输出

【讨论】：