How to open link inside the pdf in webview flutter - flutter

I have added a pdfviewer in my Apps using Library flutter: flutter_cached_pdfview
some part of the code:
import 'package:flutter_cached_pdfview/flutter_cached_pdfview.dart';
goToReading(String link){
Navigator.push(context, MaterialPageRoute(
builder: (_)=> PDF(
enableSwipe: true,
swipeHorizontal: false,
autoSpacing: false,
pageFling: false,
onError: (error) {
print(error.toString());
},
onPageError: (page, error) {
print('$page: ${error.toString()}');
},
).fromUrl(link,
placeholder: (progress) => Scaffold(
backgroundColor: Colors.white,
body: Center(
child: Lottie.asset(
'assets/images/data.json',
height: 200,
controller: _controller,
onLoaded: (composition) {
_controller..duration = composition.duration..forward();
},
),
),
)
)
));
}
What I want is to open every link inside the pdf to open in webview for now it open in external browser (Chrome, safari),
************************************************************************I want it to open in internal webview inside the app it may be possible by using urllauncher but i dont know how to use it,
See this to understand my problem
See this to understand the current status

You have to set onLinkHandle and preventLinkNavigation:true in your file.
On onLinkHandle, you can set it to open WebView inside your app instead of opening the browser for it. Becuase by default it will always open web browser if you don't specify those things.

Related

Open Facebook app with url_launcher package in Flutter

I am trying to open the Facebook app on a company page in Flutter but it keeps opening it in the web browser instead.
It's just a simple widget that outputs a row of social media icons from a list:
import 'package:flutter/material.dart';
import 'package:url_launcher/url_launcher.dart';
class SocialMediaLinks extends StatelessWidget {
SocialMediaLinks({Key? key}) : super(key: key);
final List<Map<dynamic, dynamic>> icons = [
{
'name': 'twitter',
'launchUrl': 'twitter://PAGENAME',
'backupUrl': 'https://twitter.com/PAGENAME',
},
{
'name': 'facebook',
'launchUrl': 'fb://page/PAGEID',
'backupUrl': 'https://www.facebook.com/PAGENAME',
},
{
'name': 'instagram',
'launchUrl': 'instagram://PAGENAME',
'backupUrl': 'https://www.instagram.com/PAGENAME',
}
];
#override
Widget build(BuildContext context) {
return Row(
children: [
for (Map i in icons)
IconButton(
onPressed: () async {
await canLaunch(i['launchUrl'])
? launch(
i['launchUrl'],
forceSafariVC: false,
forceWebView: false,
)
: launch(
i['backupUrl'],
forceSafariVC: false,
forceWebView: false,
);
},
splashRadius: 30.0,
iconSize: 38.0,
icon: Image.asset(
"assets/images/icons/${i['name']}.png",
color: Colors.white,
),
),
],
);
}
}
Twitter and Instagram work and open in their apps but Facebook still only opens in the web browser. I've tried tonnes of solutions on stackoverflow but to no avail. Am I missing something?
Thanks.
I've observed a limitation with the supported URLs configured in the Facebook app. In Android at least, while the Facebook app has support for facebook.com, I noticed that the Facebook app opens when it's a link to a specific post i.e. https://www.facebook.com/$profileId/posts/$postId
However, the Facebook app seems to be unable to handle direct links to the profile or page i.e. https://www.facebook.com/$profileId
If you're linking to a profile/page in Facebook, you can pin a post in the profile/page and share the link of the Facebook post as a workaround. This should successfully open the Facebook app installed on the device.

Hint text is not visible in login_fresh package of flutter

I want to show hint text over the input box in flutter. And I did not find any hint key related to this package. It is neither visible on the login nor the sign-up page.
LoginFresh buildLoginFresh() {
List<LoginFreshTypeLoginModel> listLogin = [
LoginFreshTypeLoginModel(
callFunction: (BuildContext _buildContext) {
// develop what they want the facebook to do when the user clicks
},
logo: TypeLogo.facebook),
LoginFreshTypeLoginModel(
callFunction: (BuildContext _buildContext) {
// develop what they want the Google to do when the user clicks
},
logo: TypeLogo.google),
LoginFreshTypeLoginModel(
callFunction: (BuildContext _buildContext) {
Navigator.of(_buildContext).push(
MaterialPageRoute(
builder: (_buildContext) => widgetLoginFreshUserAndPassword(),
),
);
},
logo: TypeLogo.userPassword,
),
];
return LoginFresh(
pathLogo: 'assets/images/horario.jpg',
backgroundColor: Colors.black,
textColor: Colors.black,
isExploreApp: false,
functionExploreApp: () {
// develop what they want the ExploreApp to do when the user clicks
},
isFooter: false,
widgetFooter: widgetFooter(),
typeLoginModel: listLogin,
isSignUp: true,
widgetSignUp: widgetLoginFreshSignUp(),
);
}
Click here is view screenshot
Wrap your LoginFreshUserAndPassword with the Theme widget like this :
Theme(
data: ThemeData(hintColor: Colors.red),
child: LoginFreshUserAndPassword(),
)
it should work now.

how to refresh current page while doing pull to refresh (LiquidPullToRefresh) in Flutter Bloc

am using bloc method for home screen. I want to do pull to refresh in home screen...
I tired too many ways not getting solution...could you please suggest some solution.
In side onrefresh() I added few changes
1 . BlocProvider(
create: (context) => OttGetAllMovie(httpClient: http.Client())
..add(FeedsFetched(widget.title, "homePage")),
//child: HomePage(),
child: OttGetHomeInnerCatPage(
wtitle: widget.title, mixpanelinner: widget.mixpanel),
)
2. _feedsBloc.add(FeedsFetched(widget.wtitle, "homePage"));
3. setState(() {
_feedsBloc.add(FeedsFetched(widget.wtitle, "homePage"));
BlocProvider(
create: (context) => OttGetAllMovie(httpClient: http.Client())
..add(FeedsFetched(widget.title, "homePage")),
//child: HomePage(),
child: OttGetHomeInnerCatPage(
wtitle: widget.title, mixpanelinner: widget.mixpanel),
)
});
While
this seems to be the method you're using to fetch data
OttGetAllMovie(httpClient: http.Client())
..add(FeedsFetched(widget.title, "homePage")),
Wrap your body in liquid pull to refresh
LiquidPullToRefresh(
key: _refreshIndicatorKey, // key if you want to add
onRefresh: ()async{
//cal your data source
OttGetAllMovie(httpClient: http.Client())
..add(FeedsFetched(widget.title, "homePage")),
}
child: ListView(), // scroll view
);

Flutter "Rate my App" always requires a Review when using native dialog on Android

I'm using the 'Rate my App' package to ask for rates in my app. https://pub.dev/packages/rate_my_app
I'm using the same code shown in the package page, but i'm setting the 'ignoreNativeDialog' parameter to false in order to use the native API even in Android. But when the dialog appears on android always requires a review after a rate.
Is it any way to set the review to be optional?
RateMyApp rateMyApp = RateMyApp(
preferencesPrefix: 'rateMyApp_',
minDays: 7,
minLaunches: 10,
remindDays: 7,
remindLaunches: 10,
);
rateMyApp.init().then((_) {
if (rateMyApp.shouldOpenDialog) {
rateMyApp.showStarRateDialog(
context,
title: 'Rate this app',
message: 'You like this app ? Then take a little bit of your time to leave a rating :',
actionsBuilder: (context, stars) {
return [
FlatButton(
child: Text('OK'),
onPressed: () async {
print('Thanks for the ' + (stars == null ? '0' : stars.round().toString()) + ' star(s) !');
await rateMyApp.callEvent(RateMyAppEventType.rateButtonPressed);
Navigator.pop<RateMyAppDialogButton>(context, RateMyAppDialogButton.rate);
},
),
];
},
ignoreNativeDialog: false, // This is the one parameter i set to false
dialogStyle: DialogStyle(
titleAlign: TextAlign.center,
messageAlign: TextAlign.center,
messagePadding: EdgeInsets.only(bottom: 20),
),
starRatingOptions: StarRatingOptions(),
onDismissed: () => rateMyApp.callEvent(RateMyAppEventType.laterButtonPressed),
);
}
});
Now it's clear.
The review was required becouse I was using it on a registered tester account. I tested with another account and it worked fine.

How can I render custom widget according to html tags using flutter_html package?

I have a HTML document and I want to render it with Flutter using flutter_html plugin. I want to render different typography differently. Eg. I want to have different font and size for bold and different for non-bold.
I tried reading the documentation which has a property for the Html constructor called customRenderer, I couldn't understand the implementation for it.
Below is the code from documentation.
Html(
data: """
<!--For a much more extensive example, look at example/main.dart-->
<div>
<h1>Demo Page</h1>
<p>This is a fantastic nonexistent product that you should buy!</p>
<h2>Pricing</h2>
<p>Lorem ipsum <b>dolor</b> sit amet.</p>
<h2>The Team</h2>
<p>There isn't <i>really</i> a team...</p>
<h2>Installation</h2>
<p>You <u>cannot</u> install a nonexistent product!</p>
<!--You can pretty much put any html in here!-->
</div>
""",
padding: EdgeInsets.all(8.0),
backgroundColor: Colors.white70,
defaultTextStyle: TextStyle(fontFamily: 'serif'),
linkStyle: const TextStyle(
color: Colors.redAccent,
),
onLinkTap: (url) {
},
customRender: (node, children) {
if(node is dom.Element) {
switch(node.localName) {
case "video": return Chewie(...);
case "custom_tag": return CustomWidget(...);
}
}
},
)
If I just can change font size and font family according to the tag name, it will do.
Here's a sample using flutter_html. (as of typing this you should go with flutter_html_all. Same package but there has been some renaming. customRender is now customRenders (plural))
return Html(
data: <span>Some normal HTML</span> then appears a <customtag>Some data in this one</customtag>,
tagsList: Html.tags..addAll(['customtag']),
customRenders:
{
customTagMatcher(): CustomRender.widget(widget: (context, buildChildren)
{
final element = context.tree.element!;
// Your conditions with the element.
// finally return your own custom widget:
return Container(child: Text('My custom widget...'));
}),
}
);
CustomRenderMatcher customTagMatcher() => (context) => context.tree.element?.localName == 'customtag';
More info:
https://github.com/Sub6Resources/flutter_html#customrenders
https://github.com/Sub6Resources/flutter_html/discussions/973
On mobile you can use webview_flutter to display html script on a page.
WebView(
javascriptMode: JavascriptMode.unrestricted,
onWebViewCreated: (WebViewController webViewController) {
final String contentBase64 = base64Encode(const Utf8Encoder().convert(Source.html));
webViewController.loadUrl('data:text/html;base64,$contentBase64');
},
),
If you're planning to use this on web, you can use dart:html
void main() {
// ignore: undefined_prefixed_name
ui.platformViewRegistry.registerViewFactory(
'html-view-tag',
(int viewId) => IFrameElement()
..srcdoc = Source.html
..style.border = 'none');
runApp(const MyApp());
}
and on your Screen, add HtmlElementView like a Widget
body: Center(
child: HtmlElementView(viewType: 'html-view-tag')
),
I just defined the source html like this
class Source {
static const html =
'<!--For a much more extensive example, look at example/main.dart-->'
'<div>'
'<h1>Demo Page</h1>'
'<p>This is a fantastic nonexistent product that you should buy!</p>'
'<h2>Pricing</h2>'
'<p>Lorem ipsum <b>dolor</b> sit amet.</p>'
'<h2>The Team</h2>'
'<p>There isn\'t <i>really</i> a team...</p>'
'<h2>Installation</h2>'
'<p>You <u>cannot</u> install a nonexistent product!</p>'
'<!--You can pretty much put any html in here!-->'
'</div>';
}