Использование изображения актива в качестве значков вкладок во флаттере - PullRequest
Новая
       24

Использование изображения актива в качестве значков вкладок во флаттере

0 голосов
/ 19 марта 2020

Я хочу загрузить изображения из моего ресурса в моем TabBar во флаттере. У меня есть изображения в папке с активами как активные и неактивные. Изображения не отображаются хорошо, но я не получаю никаких ошибок.

Они просто показывают прямоугольные angular темные изображения. Что я делаю не так? 

import 'package:flutter/material.dart';

class Choice {
  final String title;
  final String image;

  Choice(this.title, this.image);
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    List<Choice> tabs = [
      Choice('Active', 'images/active.png'),
      Choice('Inactive', 'images/inactive.png'),
    ];

    return MaterialApp(
      home: DefaultTabController(
        length: tabs.length,
        child: Scaffold(
          appBar: AppBar(
            bottom: TabBar(
              tabs: tabs
                  .map((Choice tab) => Tab(
                text: tab.title,
                icon: Image.asset(tab.image),
              ))
                  .toList(),
            ),
          ),
        ),
      ),
    );
  }
}

Main.dart 

  TabBar(
                      isScrollable: true,
                      tabs: choices.map<Widget>((Choice choice) {
                        return new Tab(icon: new Image.asset(choice.image), text: choice.title);
                      }).toList(),
                      labelColor: Color(0xFF1C2447),
                    )

1 Ответ

0 голосов
/ 19 марта 2020

Вы не должны использовать ImageIcon для описанного вами варианта использования, вы можете использовать провайдера Image.asset, чтобы изображение отображалось в ваших вкладках.

Например: 

new Tab(icon: new Image.asset(choice.icon.image), text: choice.title),

Вот полный пример этого в действии: 

import 'package:flutter/material.dart';

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

class Choice {
  final String title;
  final String image;

  Choice(this.title, this.image);
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    List<Choice> tabs = [
      Choice('Active', 'images/active.png'),
      Choice('Inactive', 'images/inactive.png'),
    ];

    return MaterialApp(
      home: DefaultTabController(
        length: tabs.length,
        child: Scaffold(
          appBar: AppBar(
            bottom: TabBar(
              tabs: tabs
                  .map((Choice tab) => Tab(
                        text: tab.title,
                        icon: Image.asset(tab.image),
                      ))
                  .toList(),
            ),
          ),
        ),
      ),
    );
  }
}
...