我正在制作一張卡片,顯示一張卡片的詳細資訊。整個想法是提供可以單擊以將用戶帶到應用程式本身的關聯鏈接的圖示,但具有諷刺意味的是,它不起作用。沒有引發錯誤,但是當我嘗試單擊圖示時,它不會將我帶到與其關聯的鏈接。請有人幫助我,請讓我知道我錯在哪里。這是我正在使用的:
import 'package:flutter/material.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:url_launcher/link.dart';
class BhaskarCard extends StatefulWidget {
const BhaskarCard({Key? key}) : super(key: key);
@override
State<BhaskarCard> createState() => _BhaskarCardState();
}
class _BhaskarCardState extends State<BhaskarCard> {
final double coverHeight = 280;
final double profileHeight = 144;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
centerTitle: true,
elevation: 0,
backgroundColor: Colors.white,
iconTheme: const IconThemeData(color: Colors.black),
title: const Text(
"The Writing Paradigm",
style: TextStyle(
color: Colors.black,
fontWeight: FontWeight.w500,
),
),
),
body: ListView(
padding: EdgeInsets.zero,
children: [
buildTop(),
buildContent(),
],
),
);
}
Widget buildTop() {
final top = coverHeight - profileHeight / 2;
final bottom = profileHeight / 2;
return Stack(
clipBehavior: Clip.none,
alignment: Alignment.center,
children: [
Container(
margin: EdgeInsets.only(bottom: bottom),
child: buildCoverImage(),
),
Positioned(
top: top,
child: buildProfileImage(),
),
],
);
}
Widget buildCoverImage() => Container(
color: Colors.grey,
child: Image.network(
'https://images.unsplash.com/photo-1515879218367-8466d910aaa4?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxzZWFyY2h8OHx8Y29kZXxlbnwwfHwwfHw=&w=1000&q=80',
width: double.infinity,
height: coverHeight,
fit: BoxFit.cover,
),
);
Widget buildProfileImage() => CircleAvatar(
radius: profileHeight / 2,
backgroundColor: Colors.grey.shade800,
backgroundImage: const AssetImage('images/bhaskar.jpg'),
);
}
Widget buildContent() => Column(
children: [
const SizedBox(
height: 16.0,
),
const Text(
'Bhaskar Sharma',
style: TextStyle(fontSize: 28.0, fontWeight: FontWeight.w700),
),
const SizedBox(
height: 12.0,
),
const Text(
'Founder',
style: TextStyle(fontSize: 25.0, fontWeight: FontWeight.w500),
),
const SizedBox(
height: 21.0,
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Link(
builder:
(BuildContext context, Future<void> Function()? followLink) =>
buildSocialIcon(FontAwesomeIcons.facebook),
uri: Uri.parse('https://www.facebook.com/bhaskar2510/'),
target: LinkTarget.blank,
),
const SizedBox(
width: 16.0,
),
buildSocialIcon(
FontAwesomeIcons.github,
),
const SizedBox(
width: 16.0,
),
buildSocialIcon(FontAwesomeIcons.twitter),
const SizedBox(
width: 16.0,
),
buildSocialIcon(FontAwesomeIcons.linkedin),
],
),
const SizedBox(
height: 16.0,
),
const Divider(
height: 7.0,
),
const SizedBox(
height: 16.0,
),
buildAbout(),
const SizedBox(
height: 32.0,
),
],
);
Widget buildAbout() => Padding(
padding: const EdgeInsets.symmetric(horizontal: 48.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: const [
Text(
'About',
style: TextStyle(fontSize: 28.0, fontWeight: FontWeight.w500),
),
SizedBox(
height: 16.0,
),
Text(
'Abcd',
style: TextStyle(fontSize: 18.0, height: 1.4),
),
],
),
);
Widget buildSocialIcon(IconData icon) => CircleAvatar(
radius: 25.0,
child: Material(
shape: const CircleBorder(),
clipBehavior: Clip.hardEdge,
color: Colors.transparent,
child: InkWell(
onTap: () {},
child: Center(
child: Icon(
icon,
size: 30,
),
),
),
));
uj5u.com熱心網友回復:
按下圖示時沒有呼叫任何方法。您可以像傳遞圖示一樣傳遞 url,并嘗試使用 url 啟動器或您選擇的任何包打開它。
Widget buildSocialIcon(IconData icon, Uri uri) => CircleAvatar(
radius: 25.0,
child: Material(
shape: const CircleBorder(),
clipBehavior: Clip.hardEdge,
color: Colors.transparent,
child: InkWell(
onTap: () async{
//Use url launcher package
if (!await launchUrl(url)) print('Could not launch $_url');
},
child: Center(
child: Icon(
icon,
size: 30,
),
),
),
));
添加圖示時使用此
buildSocialIcon(Icons.mail, Uri(
scheme: 'mailto',
path: '[email protected]',
query: encodeQueryParameters(<String, String>{
'subject': 'Example Subject & Symbols are allowed!'
}),
));
buildSocialIcon(Icons.fb, Uri.parse('https://www.facebook.com');
確保也將這些添加到 AndroidManifest.xml
<queries>
<!-- If your app opens https URLs -->
<intent>
<action android:name="android.intent.action.VIEW" />
<data android:scheme="https" />
</intent>
<!-- If your app makes calls -->
<intent>
<action android:name="android.intent.action.DIAL" />
<data android:scheme="tel" />
</intent>
<!-- If your sends SMS messages -->
<intent>
<action android:name="android.intent.action.SENDTO" />
<data android:scheme="smsto" />
</intent>
<!-- If your app sends emails -->
<intent>
<action android:name="android.intent.action.SEND" />
<data android:mimeType="*/*" />
</intent>
</queries>
uj5u.com熱心網友回復:
IconButton使用為此目的命名的小部件。
IconButton(
icon: Icon(Icons. ///your icon here),
onPressed: (){
///your function here what to do
}
)
轉載請註明出處,本文鏈接:https://www.uj5u.com/caozuo/486634.html
