Wenn ich eine App mit flutter create
Befehl erstelle , wird das Flatterlogo als Anwendungssymbol für beide Plattformen verwendet.
Wenn ich das App-Symbol ändern möchte, gehe ich zu beiden Plattformverzeichnissen und ersetze dort Bilder? Durch Plattformverzeichnisse, die ich myapp/ios/Runner/Assets.xcassets/AppIcon.appiconset
für iOS und myapp/android/app/src/main/res
Android meine .
Oder ist es möglich, ein Bild als Flutter Asset zu definieren und die Symbole werden irgendwie generiert?
flutter
application-icon
RobertoAllende
quelle
quelle
Antworten:
Flutter Launcher Icons wurde entwickelt, um schnell Launcher-Symbole für Android und iOS zu generieren: https://pub.dartlang.org/packages/flutter_launcher_icons
Ich hoffe, der GitHub README ein Video hinzufügen zu können, um es zu demonstrieren
Ein Video zur Ausführung des Tools finden Sie hier .
Wenn jemand Verbesserungen vorschlagen / Fehler melden möchte, fügen Sie diese bitte als Problem im GitHub-Projekt hinzu .
Update: Ab Mittwoch, dem 24. Januar 2018 sollten Sie in der Lage sein, neue Symbole zu erstellen, ohne die alten vorhandenen Startsymbole in Ihrem Flutter-Projekt zu überschreiben.
Update 2: Ab Version 0.4.0 (8. Juni 2018) können Sie ein Bild für Ihr Android-Symbol und ein separates Bild für Ihr iOS-Symbol angeben.
Update 3: Ab Version 0.5.2 (20. Juni 2018) können Sie jetzt adaptive Startsymbole für die Android-App Ihres Flutter-Projekts hinzufügen
quelle
710x599
. Was war der Grund dafür? Ich hätte erwartet512x512
oder1000x1000
sowieso etwas Quadratisches.Festlegen der Startsymbole wie bei einem nativen Entwickler
Ich hatte einige Probleme beim Verwenden und Verstehen des Pakets flutter_launcher_icons . Mit dieser Antwort würden Sie es tun, wenn Sie eine App für Android oder iOS nativ erstellen würden. Es ist ziemlich schnell und einfach, wenn Sie es ein paar Mal gemacht haben.
Android
Android-Startsymbole haben sowohl eine Vordergrund- als auch eine Hintergrundebene.
(Bild aus der Android-Dokumentation angepasst )
Der einfachste Weg, Startsymbole für Android zu erstellen, ist die Verwendung von Asset Studio, das direkt in Android Studio verfügbar ist. Sie müssen Ihr Flutter-Projekt nicht einmal verlassen. (VS-Code-Benutzer können Android Studio nur für diesen Schritt in Betracht ziehen. Es ist wirklich sehr praktisch und es tut nicht weh, mit einer anderen IDE vertraut zu sein.)
Klicken Sie mit der rechten Maustaste auf den
android
Ordner in der Projektskizze. Gehen Sie zu Neu> Image Asset . (Klicken Sie mit der rechten Maustaste auf denandroid/app
Ordner, wenn Sie Image Asset nicht sehen als Option angezeigt wird.) Jetzt können Sie ein Bild auswählen, aus dem Sie Ihr Startsymbol erstellen möchten.(Löwe Clipart von hier )
Dadurch werden die aktuellen Startsymbole ersetzt. Sie finden die generierten Symbole in den
mipmap
Ordnern:Wenn Sie die Startsymbole lieber manuell erstellen möchten, lesen Sie dieser Antwort Hilfe.
Stellen Sie schließlich sicher, dass der Name des Startsymbols im AndroidManifest mit dem oben genannten übereinstimmt (
ic_launcher
standardmäßig):Führen Sie die App im Emulator aus, um zu bestätigen, dass das Startsymbol erfolgreich erstellt wurde.
iOS
Früher habe ich die Größe meiner iOS-Symbole immer manuell geändert. Wenn Sie jedoch einen Mac haben, gibt es im Mac App Store eine kostenlose App namens Icon Set Creator . Sie geben ihm ein Bild (mit mindestens
1024x1024
Pixeln) und es spuckt alle benötigten Größen (plus dieContents.json
Datei) aus. Vielen Dank an diese Antwort für den Vorschlag.iOS-Symbole sollten keine Transparenz haben. Weitere Richtlinien finden Sie hier .
Nachdem Sie den Symbolsatz erstellt haben, starten Sie Xcode (vorausgesetzt, Sie haben einen Mac) und öffnen damit den
ios
Ordner in Ihrem Flutter-Projekt. Gehen Sie dann zu Runner> Assets.xcassets und löschen Sie das AppIcon-Element.Klicken Sie danach mit der rechten Maustaste und wählen Sie Importieren ... . Wählen Sie den gerade erstellten Symbolsatz.
Das ist es. Bestätigen Sie, dass das Symbol erstellt wurde, indem Sie die App im Simulator ausführen.
Wenn Sie keinen Mac haben ...
Sie können weiterhin alle Bilder von Hand erstellen. Gehen Sie in Ihrem Flutter-Projekt zu
ios/Runner/Assets.xcassets/AppIcon.appiconset
.Die Bildgrößen, die Sie benötigen, sind die multiplizierten Größen im Dateinamen. Zum Beispiel
[email protected]
wären29
Zeiten3
,87
dh Pixel quadratisch. Sie müssen entweder dieselben Symbolnamen beibehalten oder die JSON-Datei bearbeiten.quelle
Befolgen Sie einfache Schritte:
flutter_launcher_icons
Pluginpubspec.yaml
z.B
Bereiten Sie ein App-Symbol für den angegebenen Pfad vor.
e.g. icon/icon.png
Führen Sie den Befehl auf dem Terminal aus, um App-Symbole zu erstellen:
$ flutter pub get
$ flutter pub pub run flutter_launcher_icons:main
Um alle verfügbaren Optionen zu überprüfen und verschiedene Symbole für Android und iOS festzulegen, lesen Sie bitte diese Informationen
Hoffe das wird anderen helfen.
quelle
flutter pub pub run flutter_launcher_icons:main
. Danke für den Tipp!Sie müssen die Flutter-Symboldateien durch eigene Bilder ersetzen. Diese Seite hilft Ihnen dabei, Ihr PNG in Launcher-Symbole in verschiedenen Größen zu verwandeln:
https://romannurik.github.io/AndroidAssetStudio/icons-launcher.html
quelle
Ich habe es in den folgenden Schritten geändert:
1) Bitte fügen Sie diese Abhängigkeit auf Ihrer pubspec.yaml-Seite hinzu
2) Sie müssen ein Bild / Symbol in Ihr Projekt hochladen, das Sie als Startsymbol sehen möchten. (Ich habe einen Ordnernamen erstellt: Bild in meinem Projekt, dann lade die logo.png in den Bildordner hoch). Jetzt müssen Sie die folgenden Codes hinzufügen und Ihren Bildpfad in image_path einfügen: auf der Seite pubspec.yaml.
3) Gehen Sie zum Terminal und führen Sie diesen Befehl aus:
4) Geben Sie nach Ausführung des Befehls den folgenden Befehl ein:
5) Fertig
NB: (natürlich eine aktualisierte Abhängigkeit von hinzufügen
)
quelle
Ich würde Ihnen empfehlen, diese unten verlinkte Website zu nutzen
App Icon Creator
Schritt 1: Laden Sie das Bild hoch,
Schritt 2: Nehmen Sie die erforderlichen Änderungen vor und klicken Sie auf Download (ändern Sie den Dateinamen nicht).
Schritt 3: Extrahieren Sie die heruntergeladene Zip-Datei in den entsprechenden Ordner
quelle
Beste und empfohlene Methode zum Festlegen des App-Symbols in Flutter.
Ich habe ein Plugin gefunden, mit dem das App-Symbol in flutter gesetzt werden kann: "flutter_launcher_icons". Wir werden dieses Plugin verwenden, um das App-Symbol in Flattern zu versetzen.
Fügen Sie dieses Plugin in der Datei pubspec.yaml im Projektstammverzeichnis hinzu. Bitte überprüfen Sie unten Code,
Abhängigkeiten:
flattern:
sdk: flattern
cupertino_icons: ^ 0.1.2
flutter_launcher_icons: ^ 0.7.2 + 1
Speichern Sie die Datei und führen Sie Flutter Pub Get auf Terminal.
Erstellen Sie ein Ordner-Asset im Stammverzeichnis des Projekts in Ordner-Assets. Erstellen Sie auch ein Ordnersymbol und platzieren Sie Ihr App-Symbol in diesem Ordner. Ich werde dem Benutzer 1024x1024 App-Symbolgröße empfehlen. Ich habe das App-Symbol im Symbolordner abgelegt und jetzt habe ich den Pfad für das App-Symbol als Assets / icon / icon.png
Fügen Sie nun in pubspec.yaml den folgenden Code hinzu:
flutter_icons:
android: "launcher_icon"
ios: true
image_path: "assets / icon / icon.png"
Speichern Sie die Datei und führen Sie Flutter Pub Get auf Terminal. Führen Sie nach dem Ausführen des Befehls den zweiten Befehl wie folgt aus
flutter pub run flutter_launcher_icons: main -f pubspec.yaml
Führen Sie dann App aus
quelle
Am besten ändern Sie die Startsymbole für iOS und Android separat.
Ändern Sie die Symbole im iOS- und Android-Modul separat. Das Plugin erzeugt Symbole unterschiedlicher Größe aus demselben Symbol, die verzerrt sind.
Folgen Sie diesem Link: https://flutter.dev/docs/deployment/android
quelle
Sie können dies erreichen, indem Sie flutter_launcher_icons in pubspec.yaml verwenden
Eine andere Möglichkeit ist, eine für Android und eine andere für iOS zu verwenden
quelle