Buscar pacotes, repositórios e categorias de apps

Repositório GitHubFurkankyl/full_screen_image

imagem em tela cheia

Visualizador de fotos em tela cheia. Desliga ao rolar verticalmente. Pode funcionar com o widget Hero

Capa do projeto imagem em tela cheia
Estrelas
19
Forks
25
Último push (UTC)
11 de out. de 2023
Status do projeto
Ativo

README original

Texto original em inglês. Visite o GitHub para a versão atual.

Full Screen image

Full screen photo viewer. It shuts off when scrolling vertically. Can work with Hero widget

Installation

To use this plugin, add full_screen_image as a dependency in your pubspec.yaml file.

full_screen_image: any

Getting Started

Check out the example app using full_screen_image.

Flutter

Full screen image:
  FullScreenWidget(
        child: ClipRRect(
          borderRadius: BorderRadius.circular(16),
          child: Image.asset(
            "assets/image1.jpg",
            fit: BoxFit.cover,
          ),
        ),
      )

Full screen with hero:
FullScreenWidget(
        child: Hero(
          tag: "customTag",
          child: ClipRRect(
            borderRadius: BorderRadius.circular(16),
            child: Image.asset(
              "assets/image2.jpg",
              fit: BoxFit.cover,
            ),
          ),
        ),
      );

Small image:

if you don't want widget full screen then use center widget

 FullScreenWidget(
        child: Center(
          child: Hero(
            tag: "smallImage",
            child: ClipRRect(
              borderRadius: BorderRadius.circular(16),
              child: Image.asset(
                "assets/image3.jpg",
                fit: BoxFit.cover,
              ),
            ),
          ),
        ),
      );
Custom background color:
FullScreenWidget(
        backgroundColor: Colors.purple,
        child: Center(
          child: Hero(
            tag: "customBackground",
            child: ClipRRect(
              borderRadius: BorderRadius.circular(16),
              child: Image.asset(
                "assets/image3.jpg",
                fit: BoxFit.cover,
              ),
            ),
          ),
        ),
      );

Non transparent widget:
FullScreenWidget(
        backgroundColor: Colors.purple,
        backgroundIsTransparent: false,
        child: Center(
          child: Hero(
            tag: "nonTransparent",
            child: ClipRRect(
              borderRadius: BorderRadius.circular(16),
              child: Image.asset(
                "assets/image3.jpg",
                fit: BoxFit.cover,
              ),
            ),
          ),
        ),
      );

Custom widget:
  FullScreenWidget(
        child: SafeArea(
          child: Card(
            elevation: 4,
            child: Container(
              height: 350,
              padding: const EdgeInsets.all(8.0),
              child: Column(
                children: <Widget>[
                  Hero(
                    tag: "customWidget",
                    child: ClipRRect(
                      borderRadius: BorderRadius.circular(16),
                      child: Image.asset(
                        "assets/image3.jpg",
                        fit: BoxFit.cover,
                      ),
                    ),
                  ),
                  SizedBox(
                    height: 16,
                  ),
                  Text('Lorem text',style: TextStyle(color: Colors.black,fontWeight: FontWeight.bold),),
                  SizedBox(
                    height: 16,
                  ),
                  Expanded(
                    child: Text(
                      lorem,
                    ),
                  ),

                ],
              ),
            ),
          ),
        ),
      );

License

Apache

Furkankyl GitHub avatar
Autor no GitHub

Furkankyl ↗

Computer Engineer

İstanbul | Turkey
LinguagensDartSwiftKotlinObjective-C

Pacotes publicados por este repositório

Dependências usadas

Lista de dependências 2 itens

  • flutter{"sdk":"flutter"}
  • flutter_testDesenvolvimento{"sdk":"flutter"}

Como escolher um repositório para seu projeto?

Filtre pelo caso de uso, compare a atividade e confira o projeto original antes de adotá-lo.

  1. Busque por nome, autor ou descrição e filtre por tema.
  2. Compare estrelas, forks e envios recentes. Estrelas indicam interesse, mas não garantem qualidade.
  3. Confira o README, a licença e as issues no GitHub antes de usar o projeto.

Fontes e manutenção

“A repository is the most basic element of GitHub.”

GitHub Docs — About repositories ↗