How to play mjpeg video stream in Dart? - dart

i found a package that helps to open files in mjpeg format, but when i insert my stream nothing works and i get invalid image error, how can I solve it? Here is my content-type info about video stream: MotionImageStream
Now code looks like this:
Expanded(
child: Center(
child: Mjpeg(
isLive: isRunning,
error: (context, error, stack) {
print(error);
print(stack);
return Text(error.toString(),
style: TextStyle(color: Colors.red));
},
stream:
'http://10.10.2:8000/Live/HomeLiveCamera',
),
),
),

Related

I'm stuck to create rfid card in ios app and create .pkpass file then add into apple wallet using flutter

this is my code in this doesn't create an RFID card and pk pass I want to create an RFID/NFC card in my app and create a pk pass file and add it to the apple wallet I search several websites but I didn't find that error inside it. if you face this kind of problems please help me
final _saveCard = StreamBuilder(
stream: bloc.savecardValid,
builder: (context, snapshot) {
return Container(
width: MediaQuery.of(context).size.width - 40,
height: 50,
child: RaisedButton(
child: Text(
'Save Card',
style: TextStyle(color: Colors.white),
),
color: Colors.lightBlue,
onPressed: snapshot.hasData
? () {
var blocProviderCardWallet = BlocProvider(
bloc: bloc,
child: CardWallet(),
);
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => blocProviderCardWallet));
}
: null,
),
);
},
);

Flutter: How to display a text from Firebase?

I have searched a lot but I can't find a solution for this specific problem:
So I want to display a text in my flutter application. But this text shall be variable, so I integrated Firebase to my project. And everything is working well, so I already managed to show images from Firebase but I really don't know how to display a text.
Can you please show me how to do this? Maybe someone could show me the code I need to use to make this work?
This is my code so far, I didn't integrate the specific code to communicate with my Firebase backend, because I don't know how to do this.
import 'package:flutter/material.dart';
import 'package:firebase_storage/firebase_storage.dart';
import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:firebase_core/firebase_core.dart';
class MapsPage extends StatefulWidget {
MapsPage({Key key}) : super(key: key);
#override
_MapsPageState createState() => _MapsPageState();
}
class _MapsPageState extends State<MapsPage> {
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Firebase'),
flexibleSpace: Container(
decoration: BoxDecoration(
gradient: LinearGradient(
colors: [Color(0xffFBD23E), Color(0xffF6BE03)],
begin: Alignment.topCenter,
end: Alignment.bottomCenter),
),
),
),
body: Container(
decoration: BoxDecoration(
gradient: LinearGradient(
colors: [Color(0xffFEFDFD), Color(0xffBDBDB2)],
begin: Alignment.topLeft,
end: Alignment.bottomRight),
),
child: Column(
children: [
Padding(
padding: const EdgeInsets.all(12.0),
child: RichText(
text: TextSpan(
style: TextStyle(color: Colors.black),
text: 'Some text',
children: [
TextSpan(
text:
'I want this TextSpan to be variable. So if I change the data in my Firestore Database this text shall also change.',
),
TextSpan(
text: 'And some more text.',
),
],
),
),
),
],
),
),
);
}
}
Can you please help me? Thank you so much!!
Below is a screenshot of my firestore.
.
// This below returns the text
Future<Map<String, dynamic>> getData() async {
DocumentReference<Map<String, dynamic>> document =
FirebaseFirestore.instance.doc('KBADatum/6j5Fnvj0gNkSCRIx7ecH'); // path to doc
DocumentSnapshot<Map<String, dynamic>> query = await document.get();
print(query.data());
return query.data();
}
// and this is how you consume it.
FutureBuilder<Map<String, dynamic>>(
future: getData(),
builder: (BuildContext context, AsyncSnapshot<Map<String, dynamic>> snapshot) {
if (snapshot.hasError) return CircularProgressIndicator();
if (snapshot.connectionState == ConnectionState.waiting)
return CircularProgressIndicator();
return RichText(
text: TextSpan(
style: TextStyle(color: Colors.black),
text: 'Some text',
children: [
TextSpan(
text: snapshot.data['DatumJahr'], // first text
),
TextSpan(
text: 'And some more text.',
),
],
),
);
},
)
The snapshots() method provides a stream which you can subscribe to get the latest document changes. To update your ui using the stream, you can use StreamBuilder which builds itself based on the latest snapshot of interaction.
One final thing is that you can't use StreamBuilder as a child to a TextSpan. So, you will either rebuild the RichText widget or use WidgetSpan to rebuild only the span when there is an event on your stream.
Here is an example:
RichText(
text: TextSpan(
style: TextStyle(color: Colors.black),
text: 'Some text',
children: [
// Use WidgetSpan instead of TextSpan, which allows you to have a child widget
WidgetSpan(
// Use StreamBuilder to listen on the changes of your Firestore document.
child: StreamBuilder<DocumentSnapshot<Map<String, dynamic>>>(
stream: FirebaseFirestore.instance
.collection('my_collection')
.doc('my_document')
.snapshots(),
builder: (context, snapshot) {
final document = snapshot.data; // Get the document snapshot
final text = document?.data()?['my_text']; // Get the data in the text field
return Text(text ?? 'Loading...'); // Show loading if text is null
},
),
),
TextSpan(
text: 'And some more text.',
),
],
),
)
Note: I tried to keep the example simple as far as possible, but you can learn more about StreamBuilder to handle errors/data and the state of connection.

Flutter - How to turn off youtube video in webview after back event?

So i just implemented this WebView in flutter and it's great, but there's a problem when i embedd a youtube video using webview, the video is still playing even i close the Webview page. How do i turn it off?
the plugin that i use is flutter_webview_plugin
final flutterWebviewPlugin =FlutterWebviewPlugin();
#override
void initState() {
super.initState();
flutterWebviewPlugin.close();
}
#override
void dispose() {
super.dispose();
flutterWebviewPlugin.dispose();
}
and this is the widget:
IconButton(
icon: Icon(Icons.more_vert),
onPressed: () {
print('Hello there!'); flutterWebviewPlugin.launch('https://www.youtube.com/embed/m5rm8ac4Gsc');
},
)
What you can do is to create a route and but inside it your webview example: /youtubeWebview and use Navigator.popAndPushNamed(context, '/yourRoute'); to go back instead of Navigator.pop(context);
I finally get the answer but i change the package to webview_flutter instead of flutter_webview_plugin.
To stop the audio from youtube or any other website that has audio we need to change the url of the current webview. and maybe it will work with flutter_webview_plugin too.
/* define webview controller */
WebViewController _controller;
/* before we leave current route, make sure to change the url to something */
Future<bool> _willPopCallback(WebViewController controller) async {
controller.loadUrl('https://www.google.com/'); /* or you can use controller.reload() to just reload the page */
return true;
}
return WillPopScope(
onWillPop: () => _willPopCallback(_controller), /* call the function here */
child: Scaffold(
appBar: AppBar(
title: Text('Just appbar'),
),
body: Column(
children: <Widget>[
Expanded(
child: WebView(
key: UniqueKey(),
javascriptMode: JavascriptMode.unrestricted,
initialUrl: widget.videoUrl,
onWebViewCreated: (WebViewController webViewController) { /* i am not sure what this line actually do */
_controller = webViewController;
},
),
),
Text(
'Please pause the video before you go back',
style: TextStyle(
color: Colors.black,
),
)
],
),
),
);

Dart : How to fetch data with no number id (string)?

So I was able to fetch data for 'locations' in this json using the number (0,1,2,3,4). But I was not able to fetch data from 'prayer_times' string directly. Is there any way to solve this?
I have tried Text(data["date"] because it cannot start with string right away and will give error The argument type 'dart.core::String' can't be assigned to the parameter type
'dart.core::int'.
The api is working do check the link thanks.
Data fetch display code
Card(
child: Container(
padding: EdgeInsets.all(15.0),
child: Row(
children: <Widget>[
Text("Name: "),
Text(data[0]["date"],
style: TextStyle(
fontSize: 18.0, color: Colors.black87)),
],
)),
),
API URI code
final String url = "http://api.azanpro.com/times/today.json?zone=ngs02&format=12-hour";
List data;
Future<String> getSWData() async {
var res = await http
.get(Uri.encodeFull(url), headers: {"Accept": "application/json"});
setState(() {
var resBody = json.decode(res.body);
data = resBody["prayer_times"];
});
You just need to make two changes.
Change the type of data to a Map and depending on your use case, initialise it to a default value:
Map<String, dynamic> data = {'date': "-------"};
And then get the date field directly in data
Card(
child: Container(
padding: EdgeInsets.all(15.0),
child: Row(
children: <Widget>[
Text("Name: "),
Text(data["date"],
style: TextStyle(
fontSize: 18.0, color: Colors.black87)),
],
)),
),

app.dart error when trying to navigate to new page using ontap

I am using Fontawesome icons to navigate to a new page in flutter using ontap and im getting a strange error in app.dart.
Im pretty new to dart so my debugging skills arent revealing anything. Here is ontap code.
Widget build(BuildContext context) {
return new MaterialApp(
theme: new ThemeData(
fontFamily: "Tahoma",
brightness: Brightness.light,
primaryColor: Colors.grey, //Changing this will change the color of the TabBar
accentColor: Colors.cyan[600],
),
routes: routes,
home: DefaultTabController(
length: 1,
child: Scaffold(
appBar: new LBAppBar().getAppBar(),
drawer: new LBDrawer().getDrawer(),
body: Column(children: <Widget>[
Row(
//ROW 1
children: [
Container(
margin: EdgeInsets.all(30.0),
child: Column(
children: <Widget>[
GestureDetector(
child: Icon(
FontAwesomeIcons.solidCheckSquare,
size: 60.0,
color: const Color.fromRGBO(1,89,99, 1.0),
),
onTap: () {
Navigator.pushNamed(context, '/checkin');
}),
Text("Check In", style: new TextStyle( color: Color.fromRGBO(1,89,99, 1.0), fontWeight: FontWeight.bold ))
],
),
Im trying to navigate to a new dart file where i will capture a userid and collect information in a form but I cant get it to navigate to the new page.
---- ROUTES CODE ---
import 'package:flutter/material.dart';
import '../screens/index.dart';
import '../screens/checkin.dart';
final routes = {
'/index': (BuildContext context) => new Index(),
'/checkin': (BuildContext context) => new CheckIn(),
};
Here is the error.
The following assertion was thrown building MaterialApp(dirty, state: _MaterialAppState#6ff5c): 'package:flutter/src/widgets/app.dart': Failed assertion: line 169 pos 15: 'navigatorObservers != null': is not true.
I have a routes.dart file with the checkin route listed.
did you provide routes to your top-level app widget(meterialApp, cupertinoApp, widgetsApp)?
Navigator is only built of you have provided any routes.id you are creating widgets on the go or you needs any parameaters you can use
Navigator.of(context).push(new MaterialPageRoute(builder: (BuildContext context) => Widget())),
I found the problem, multiple material apps declared . I reduced it to one and it’s working now

Resources