首页 > 解决方案 > Flutter 在 ListTile 中的 'ontap' 事件上自动打开附加的 url

问题描述

我遇到了一个问题,因为当我将 URL 附加到列表中的每个元素时,在第一个元素上它会获取 URL 并自动打开它,那么,它有什么用?

这是我的容器

        Container(
          height: 44.0,
          child: ListView(
              scrollDirection: Axis.horizontal,
              children: _pageList(webpage, linkedin, twitter, github)),
        ),

这是列表元素的负载

List<Widget> _pageList(webpage, linkedin, twitter, github) {
  var listSkills = new List<ClipRRect>();
  if (webpage != null) listSkills.add(_createUrlElement(webpage, 'webpage'));
  if (linkedin != null) listSkills.add(_createUrlElement(linkedin, 'linkedin'));
  if (twitter != null) listSkills.add(_createUrlElement(twitter, 'twitter'));
  if (github != null) listSkills.add(_createUrlElement(github, 'github'));

  return listSkills;
}

这是元素的创建。...是的,我知道有更好的方法可以做到这一点,但是,我只是测试了所有可能性,而不是我在网上看到的,这是我拥有的最后一个代码,所以,请原谅我,不要因为这部分而杀了我代码,jeje

ClipRRect _createUrlElement(webpage, icon) {
  return ClipRRect(
    borderRadius: BorderRadius.circular(50.0),
    child: Container(
        height: 60,
        width: 60,
        color: Colors.black26, //.gray.fromRGBO(52, 58, 64, 0),
        child: ListTile(
          leading: Image.asset(
            'assets/$icon.png',
            width: 35,
            height: 35,
          ),
          subtitle: Text(''),
          title: Text(''),
          onTap: launcherUrl(webpage), // TODO: this open the url automatic
        )),
  );
}

我想这足以理解问题,但是,如果您愿意,可以检查存储库

https://github.com/sgermosen/DominicanWhoCodes/blob/master/DominicanWhoCodes.Flutter/lib/providers/cardType1.dart

标签: flutter

解决方案


不要引用函数,而是在onTap处理程序中调用它。

做这个,

ClipRRect _createUrlElement(webpage, icon) {
  return ClipRRect(
    borderRadius: BorderRadius.circular(50.0),
    child: Container(
        height: 60,
        width: 60,
        color: Colors.black26, //.gray.fromRGBO(52, 58, 64, 0),
        child: ListTile(
          leading: Image.asset(
            'assets/$icon.png',
            width: 35,
            height: 35,
          ),
          subtitle: Text(''),
          title: Text(''),
          onTap: (){
             launcherUrl(webpage)
           }, 
        )),
  );
}

这应该解决它。


推荐阅读