Loading Sound URLs And Playing Them

main.dart

// Copyright (c) 2019, the Dart project authors.  Please see the AUTHORS file
// for details. All rights reserved. Use of this source code is governed by a
// BSD-style license that can be found in the LICENSE file.

import 'package:flutter/material.dart';
import 'dart:html';
import 'dart:convert';
import 'dart:async';

class Song {
  final String name;
  final String url;
  
  Song(this.name, this.url);
}

class SoundBloc {
  
  final String songsUrl = 'https://raw.githubusercontent.com/angelhdz/dartpad_json/master/test.json';
  
  List<Song> songs = [];
  StreamController _controller = StreamController<List<Song>>();
  
  Stream<List<Song>> get soundStream => _controller.stream;
  
  SoundBloc() {
   _loadSongs();  
  }
  
  void dispose() {
    _controller.close();
  }
  
  void _loadSongs() async {
    
    final request = await HttpRequest.request(songsUrl);
    
    songs = jsonDecode(request.responseText).map<Song>((item) => Song(item['name'], item['url'])).toList();
    Future.delayed(Duration(milliseconds: 1000), () => _controller.sink.add(songs));

  }
} 

class SoundProvider extends InheritedWidget {
  
  SoundProvider({Widget child, Key key}) : super(child: child);
  
  final SoundBloc soundBloc = new SoundBloc();
  
  @override bool updateShouldNotify(Widget oldWidget) => true;
  
  static SoundBloc of(BuildContext context) {
    return context.dependOnInheritedWidgetOfExactType<SoundProvider>().soundBloc;
  }
}

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  
  @override
  Widget build(BuildContext context) {
    return SoundProvider(
      child: MaterialApp(
      title: 'Flutter Demo',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    )
    );
  }
}

class MyHomePage extends StatefulWidget {
  
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  
  final ScrollController _scrollController = new ScrollController();

  @override
  Widget build(BuildContext context) {
    final soundProvider = SoundProvider.of(context);
    
    //Uncomment the code bellow to play sounds
    //final AudioPlayer audioPlayer = AudioPlayer();
    
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body:  Padding(
        padding: EdgeInsets.all(20.0),
        child: Column(
        
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: <Widget>[
            Text('Songs'),
            Divider(),
            StreamBuilder(
              stream: soundProvider.soundStream,
            builder: (BuildContext context, AsyncSnapshot<dynamic> snapshot) {
              if (snapshot.hasData) {
            
                return Expanded(
                  child: Scrollbar(
                    child: ListView.builder(
                    controller: _scrollController,
                itemCount: soundProvider.songs.length,
                itemBuilder: (context, index) {
                  final Song song = soundProvider.songs[index];
                  return Center(
                    child: Padding(
                      padding: EdgeInsets.all(8.0),
                      child: Container(
                      width: 350.0,
                      decoration: BoxDecoration(
                       color: Colors.white,
                        boxShadow: <BoxShadow> [
                          BoxShadow(
                          blurRadius: 5,
                          color: Colors.grey
                        )
                        ]
                        ),
                      padding: EdgeInsets.all(10.0),
                    child: Column(
                     
                    children: <Widget> [
                      Row(children: <Widget> [
                        Icon(Icons.music_note, color: Colors.blue),
                        Text(song.name, style: TextStyle(color: Colors.blue)),
                        Padding(
                          padding: EdgeInsets.only(left:10.0),
                          child: IconButton(
                            icon: Icon(
                              Icons.play_circle_filled), color: Colors.blue,
                            onPressed: () {
                              print('Playing ${song.url}...');
                              //Uncomment the code bellow to play the song
                              /*
                              audioPlayer.play(song.url);
                              */
                            },
                          )
                        )
                      ]),
                      
                      
                    ]
                  )
                    ))
                  );
                },
              ),
                  )
                );
            } else {
                  return Center(child: CircularProgressIndicator());
            }
              
            },
            )
            
          
          ],
        )
        
        ),
      
    );
  }
}