Como Compilar um Aplicativo Flutter para macOS e Criar um Instalador DMG Personalizado

Introdução

Se você desenvolveu um aplicativo Flutter para macOS e deseja distribuí-lo de forma profissional, o DMG é o formato ideal. Ele permite que os usuários simplesmente arrastem o app para a pasta Aplicativos, tornando a instalação fácil e intuitiva.

Neste artigo, você aprenderá a:

• Habilitar suporte para macOS no Flutter
• Compilar o app para macOS
• Criar um instalador DMG com um ícone personalizado
• Usar um arquivo JSON para definir o layout do DMG
• Assinar e notarizar o app para distribuição na Apple

—

1. Habilitando Suporte para macOS no Flutter

Primeiro, ative o suporte ao macOS no Flutter:

flutter config --enable-macos-desktop

Agora adicione suporte ao macOS no seu projeto:

flutter create .

Isso criará a pasta macos/ dentro do seu projeto.

—

2. Compilando o Aplicativo para macOS

Para compilar o aplicativo, execute:

flutter build macos

Os arquivos gerados estarão na pasta:

build/macos/Build/Products/Release/

—

3. Criando um Ícone `.icns`

O macOS exige que o ícone do app esteja no formato `.icns`. Para converter um PNG em `.icns`, use os seguintes comandos:

mkdir icon.iconset
sips -z 16 16     icon.png --out icon.iconset/icon_16x16.png
sips -z 32 32     icon.png --out icon.iconset/icon_16x16@2x.png
sips -z 32 32     icon.png --out icon.iconset/icon_32x32.png
sips -z 64 64     icon.png --out icon.iconset/icon_32x32@2x.png
sips -z 128 128   icon.png --out icon.iconset/icon_128x128.png
sips -z 256 256   icon.png --out icon.iconset/icon_128x128@2x.png
sips -z 256 256   icon.png --out icon.iconset/icon_256x256.png
sips -z 512 512   icon.png --out icon.iconset/icon_256x256@2x.png
sips -z 512 512   icon.png --out icon.iconset/icon_512x512.png
sips -z 1024 1024 icon.png --out icon.iconset/icon_512x512@2x.png
iconutil -c icns icon.iconset -o icon.icns
rm -rf icon.iconset

—

4. Criando um Arquivo JSON para Configuração do DMG

Crie um arquivo chamado config.json para definir a posição dos elementos no instalador DMG:

{
    "title": "NOME DO MEU APP",
    "icon": "icon.icns",
    "contents": [
        {
            "x": 448,
            "y": 344,
            "type": "link",
            "path": "/Applications"
        },
        {
            "x": 192,
            "y": 344,
            "type": "file",
            "path": "../../build/macos/Build/Products/Release/meuapp.app"
        }
    ]
}

—

5. Criando o DMG com `appdmg`

Instale a ferramenta `appdmg` via npm:

npm install -g appdmg

Agora gere o DMG executando:

appdmg config.json meuapp.dmg

Isso criará o arquivo `meuapp.dmg` pronto para distribuição.

Chegando aqui, você pode distribuir seu DMG para qualquer pessoa diretamente

—

6. Assinando e Notarizando o Aplicativo

6.1 Assinatura do Aplicativo

Para evitar avisos do Gatekeeper, assine o aplicativo com um certificado Apple Developer:

security find-identity -v

Copie o identificador e use:

codesign --deep --force --verbose --sign "Developer ID Application: SEU_NOME" build/macos/Build/Products/Release/meuapp.app<br>

6.2 Notarização do Aplicativo

Para distribuir o app fora da Mac App Store, envie-o para a Apple:

ditto -c -k --keepParent "build/macos/Build/Products/Release/meuapp.app" "epocpdv.zip"

xcrun altool --notarize-app -f meuapp.zip --primary-bundle-id com.meuap.demo -u seuemail@apple.com -p senha-de-app<br>

Após a aprovação, finalize a notarização:

xcrun stapler staple "build/macos/Build/Products/Release/meuapp.app"

—

Conclusão

Agora seu aplicativo Flutter para macOS está pronto para distribuição como um DMG personalizado! 🚀