Základy rozšíření aplikace zpráv v Xamarin.iOS
Tento článek ukazuje, jak zahrnout rozšíření aplikace zpráv do řešení Xamarin.iOS, které se integruje s aplikací Zprávy a představuje uživatelům nové funkce.
Novinkou v iOSu 10 je integrace rozšíření aplikace Message App s aplikací Zprávy a představuje uživatelům nové funkce. Rozšíření může posílat texty, nálepky, mediální soubory a interaktivní zprávy.
O rozšířeních aplikací zpráv
Jak je uvedeno výše, rozšíření aplikace Message se integruje s aplikací Zprávy a uživateli prezentuje nové funkce. Rozšíření může posílat texty, nálepky, mediální soubory a interaktivní zprávy. K dispozici jsou dva typy rozšíření aplikace Message App:
- Balíčky nálepek – obsahuje kolekci nálepek, které uživatel může přidat do zprávy. Balíčky nálepek je možné vytvářet bez psaní kódu.
- iMessage App - Může prezentovat vlastní uživatelské rozhraní v aplikaci Zprávy pro výběr nálepek, zadávání textu, včetně mediálních souborů (s volitelnými převody typů) a vytváření, úpravy a odesílání zpráv interakce.
Rozšíření Message Apps poskytují tři hlavní typy obsahu:
- Interaktivní zprávy – jedná se o typ vlastního obsahu zprávy, který aplikace generuje, když uživatel klepne na zprávu, aplikace se spustí v popředí.
- Nálepky – Jsou obrázky vygenerované aplikací, které můžou být zahrnuty do zpráv odesílaných mezi uživateli.
- Další podporovaný obsah – Aplikace může poskytovat obsah, jako jsou fotky, videa, text nebo odkazy na všechny jiné typy obsahu, které aplikace Zprávy vždy podporovala.
V iOSu 10 teď obsahuje aplikace Message vlastní vyhrazenou integrovanou aplikaci App Store. Všechny aplikace, které obsahují rozšíření Aplikací zpráv, se budou v tomto obchodě zobrazovat a propagovat. Nová zásuvka aplikace Zprávy zobrazí všechny aplikace, které byly staženy ze Služby Zprávy z App Storu, aby uživatelům poskytovaly rychlý přístup.
Apple také přidal v iOSu 10 vložené atribuce aplikací, což uživateli umožňuje snadno zjistit aplikaci. Pokud například jeden uživatel odešle obsah z aplikace, kterou nemá nainstalovaný 2. uživatel (například nálepku), bude název odesílající aplikace uvedený pod obsahem v historii zpráv. Pokud uživatel klepne na jméno aplikace, otevře se App Store zpráv a aplikace vybraná ve Storu.
Rozšíření aplikací zpráv jsou podobná existujícím aplikacím pro iOS, které vývojář umí vytvářet, a budou mít přístup ke všem standardním architekturám a funkcím standardní aplikace pro iOS. Příklad:
- Mají přístup k nákupu v aplikaci.
- Mají přístup k Apple Pay.
- Mají přístup k hardwaru zařízení, jako je Kamera.
Rozšíření aplikací zpráv jsou podporována pouze v iOSu 10, ale obsah, který tato rozšíření odesílají, je možné zobrazit na zařízeních s watchOS a macOS. Nová stránka Poslední přidané do watchOS 3 zobrazí nedávné nálepky, které byly odeslány z telefonu, včetně těch z rozšíření Aplikace zpráv, a umožní uživateli odesílat tyto nálepky z hodinek.
O rozhraní Messages Framework
Novinkou v iOSu 10 je rozhraní pro zprávy, které poskytuje rozhraní mezi rozšířením Message Apps a aplikací zpráv na zařízení s iOSem uživatele. Když uživatel spustí aplikaci z aplikace Zprávy, tato architektura umožňuje aplikaci zjistit a poskytuje data a kontext potřebný k rozložení uživatelského rozhraní.
Jakmile se aplikace spustí, uživatel s ní komunikuje a vytvoří nový obsah, který se bude sdílet prostřednictvím zprávy. Aplikace pak pomocí architektury Zprávy přenese nově vytvořený obsah do aplikace Zprávy ke zpracování.
Architektura messages a rozšíření Message Apps jsou postavené na předem existujících technologiích iOS App Extensions. Další informace o rozšířeních aplikací najdete v Průvodci programováním rozšíření aplikací společnosti Apple.
Na rozdíl od jiných bodů rozšíření, které společnost Apple poskytla v celém systému, nemusí vývojář poskytovat hostitelskou aplikaci pro rozšíření aplikací zpráv, protože samotná aplikace Zprávy funguje jako kontejner. Vývojář ale má možnost přidat rozšíření Message Apps do nové nebo existující aplikace pro iOS a odeslat ho společně se sadou.
Pokud je rozšíření Message Apps součástí sady aplikací pro iOS, ikona aplikace se zobrazí na domovské obrazovce zařízení i v zásobníku aplikace Zprávy v aplikaci Zprávy. Pokud není součástí sady aplikací, zobrazí se rozšíření Message Apps pouze v zásobníku aplikace zpráv.
I když rozšíření Aplikace zpráv nejsou součástí sady hostitelských aplikací, vývojář bude muset v sadě rozšíření Message Apps poskytnout ikonu aplikace, protože se jedná o ikonu, která se zobrazí v jiných částech systému, například v zásobníku aplikace zprávy nebo Nastavení rozšíření.
O nálepkách
Apple navrhl nálepky jako nový způsob komunikace uživatelů iMessage tím, že umožňuje odesílání nálepek jako jakéhokoli jiného obsahu zprávy nebo mohou být připojeny k předchozím bublinám zpráv uvnitř konverzace.
Co jsou nálepky?
- Jedná se o obrázky, které poskytuje rozšíření Message Apps.
- Můžou to být animované nebo statické obrázky.
- Poskytují nový způsob sdílení obsahu obrázků z aplikace.
Nálepky můžete vytvořit dvěma způsoby:
- Rozšíření Aplikací zpráv nálepek se dají vytvářet uvnitř Xcode, aniž by zahrnovala jakýkoli kód. Vše, co je potřeba, jsou prostředky pro nálepky a ikony aplikací.
- Vytvořením standardního rozšíření Message Apps, které poskytuje nálepky z kódu prostřednictvím architektury Messages.
Vytváření balíčků nálepek
Balíčky nálepek se vytvářejí ze speciální šablony uvnitř Xcode a jednoduše poskytují statickou sadu prostředků obrázků, které je možné použít jako nálepky. Jak je uvedeno výše, nevyžadují žádný kód, vývojář jednoduše přetáhne soubory obrázků do složky Nálepka Pack uvnitř katalogu prostředků Nálepky.
Aby byl obrázek součástí balíčku Nálepka, musí splňovat následující požadavky:
- Obrázky musí být ve formátu PNG, APNG, GIF nebo JPEG. Apple navrhuje při poskytování prostředků nálepky používat pouze formáty PNG a APNG.
- Animované nálepky podporují pouze formáty APNG a GIF.
- Obrázky nálepek by měly poskytovat průhledné pozadí, protože je uživatel může umístit přes bubliny zpráv v konverzaci.
- Jednotlivé soubory obrázků musí být menší než 500 kB.
- Obrázky nesmí být menší než 100 × 100 bodů nebo větší než 206 × 206 bodů.
Důležité
Obrázky nálepek by měly být vždy poskytovány v @3x
rozlišení 300 x 300 až 618 x 618 pixelů. Systém podle potřeby automaticky vygeneruje @2x
a @1x
verze za běhu.
Apple navrhuje otestovat prostředky nálepkového obrázku na různých barevných pozadích (jako je bílá, černá, červená, žlutá a vícebarevná) a fotky, aby se zajistilo, že budou ve všech možných situacích vypadat co nejlépe.
Balíčky nálepek můžou poskytovat nálepky v jedné ze tří dostupných velikostí:
- Malé - 100 x 100 bodů.
- Střední – 136 x 136 bodů. Toto je výchozí velikost.
- Velké - 206 x 206 bodů.
Pomocí inspektoru atributů Xcode nastavte velikost pro celou sadu Nálepka a poskytněte pouze prostředky obrázků, které odpovídají požadované velikosti, pro nejlepší výsledky v Prohlížeči nálepek v aplikaci Zprávy.
Další informace najdete v referenčních informacích ke zprávům společnosti Apple.
Vytvoření vlastního prostředí nálepky
Pokud aplikace vyžaduje větší kontrolu nebo flexibilitu, než poskytuje balíček Nálepky, může obsahovat rozšíření aplikace zpráv a poskytovat nálepky prostřednictvím architektury Zprávy pro vlastní prostředí nálepky.
Jaké jsou výhody vytvoření vlastního prostředí nálepky?
- Umožňuje aplikaci přizpůsobit způsob zobrazení nálepek uživatelům aplikace. Chcete-li například prezentovat nálepky v jiném formátu než standardní rozložení mřížky nebo na jiném barevném pozadí.
- Umožňuje dynamické vytváření nálepek z kódu místo zahrnutí jako statických prostředků obrázků.
- Umožňuje dynamicky stahovat prostředky obrázků nálepky z webového serveru vývojáře, aniž by bylo nutné vydávat novou verzi do App Storu.
- Umožňuje přístup k fotoaparátu zařízení k vytváření nálepek za běhu.
- Umožňuje nákupy v aplikaci, aby si uživatel mohl v aplikaci koupit další nálepky.
Pokud chcete vytvořit vlastní prostředí nálepky, postupujte takto:
Ve výchozím nastavení MessagesViewController.cs
se soubor přidá do řešení. Toto je hlavní vstupní bod do rozšíření a dědí z MSMessageAppViewController
třídy.
Architektura Messages poskytuje třídy pro prezentování dostupných nálepek uživateli:
MSStickerBrowserViewController
– Řídí zobrazení, ve které se budou zobrazovat nálepky. Také odpovídáIMSStickerBrowserViewDataSource
rozhraní pro vrácení nálepek Count a Nálepka pro daný index prohlížeče.MSStickerBrowserView
- Toto je zobrazení, ve kterém se budou zobrazovat dostupné nálepky.MSStickerSize
- Rozhoduje o velikosti jednotlivých buněk pro mřížku nálepek zobrazených v zobrazení prohlížeče.
Vytvoření vlastního prohlížeče nálepek
Vývojář může dále přizpůsobit prostředí nálepek pro uživatele tím, že v rozšíření aplikace Zpráv poskytne vlastní prohlížeč nálepek (MSMessageAppBrowserViewController
). Vlastní prohlížeč nálepek změní způsob prezentování nálepek uživateli při výběru nálepky, která se má zahrnout do streamu zpráv.
Postupujte následovně:
Vzhled StickerBrowserViewController.cs
bude vypadat takto:
using System;
using System.Collections.Generic;
using UIKit;
using Messages;
using Foundation;
namespace MonkeyStickers
{
public partial class StickerBrowserViewController : MSStickerBrowserViewController
{
#region Computed Properties
public List<MSSticker> Stickers { get; set; } = new List<MSSticker> ();
#endregion
#region Constructors
public StickerBrowserViewController (MSStickerSize stickerSize) : base (stickerSize)
{
}
#endregion
#region Private Methods
private void CreateSticker (string assetName, string localizedDescription)
{
// Get path to asset
var path = NSBundle.MainBundle.PathForResource (assetName, "png");
if (path == null) {
Console.WriteLine ("Couldn't create sticker {0}.", assetName);
return;
}
// Build new sticker
var stickerURL = new NSUrl (path);
NSError error = null;
var sticker = new MSSticker (stickerURL, localizedDescription, out error);
if (error == null) {
// Add to collection
Stickers.Add (sticker);
} else {
// Report error
Console.WriteLine ("Error, couldn't create sticker {0}: {1}", assetName, error);
}
}
private void LoadStickers ()
{
// Load sticker assets from disk
CreateSticker ("canada", "Canada Sticker");
CreateSticker ("clouds", "Clouds Sticker");
...
CreateSticker ("tree", "Tree Sticker");
}
#endregion
#region Public Methods
public void ChangeBackgroundColor (UIColor color)
{
StickerBrowserView.BackgroundColor = color;
}
#endregion
#region Override Methods
public override void ViewDidLoad ()
{
base.ViewDidLoad ();
// Initialize
LoadStickers ();
}
public override nint GetNumberOfStickers (MSStickerBrowserView stickerBrowserView)
{
return Stickers.Count;
}
public override MSSticker GetSticker (MSStickerBrowserView stickerBrowserView, nint index)
{
return Stickers[(int)index];
}
#endregion
}
}
Podrobně se podívejte na výše uvedený kód. Vytvoří úložiště pro nálepky, které rozšíření poskytuje:
public List<MSSticker> Stickers { get; set; } = new List<MSSticker> ();
A přepíše dvě metody MSStickerBrowserViewController
třídy, které poskytují data pro prohlížeč z tohoto úložiště dat:
public override nint GetNumberOfStickers (MSStickerBrowserView stickerBrowserView)
{
return Stickers.Count;
}
public override MSSticker GetSticker (MSStickerBrowserView stickerBrowserView, nint index)
{
return Stickers[(int)index];
}
Metoda CreateSticker
získá cestu k prostředku image ze sady rozšíření a použije ji k vytvoření nové instance MSSticker
z tohoto prostředku, který přidá do kolekce:
private void CreateSticker (string assetName, string localizedDescription)
{
// Get path to asset
var path = NSBundle.MainBundle.PathForResource (assetName, "png");
if (path == null) {
Console.WriteLine ("Couldn't create sticker {0}.", assetName);
return;
}
// Build new sticker
var stickerURL = new NSUrl (path);
NSError error = null;
var sticker = new MSSticker (stickerURL, localizedDescription, out error);
if (error == null) {
// Add to collection
Stickers.Add (sticker);
} else {
// Report error
Console.WriteLine ("Error, couldn't create sticker {0}: {1}", assetName, error);
}
}
Metoda LoadSticker
se volá z ViewDidLoad
vytvoření nálepky z pojmenovaného prostředku obrázku (zahrnutého v sadě aplikace) a přidá ji do kolekce nálepek.
Pokud chcete implementovat vlastní prohlížeč nálepek, upravte MessagesViewController.cs
soubor a udělejte ho takto:
using System;
using UIKit;
using Messages;
namespace MonkeyStickers
{
public partial class MessagesViewController : MSMessagesAppViewController
{
#region Computed Properties
public StickerBrowserViewController BrowserViewController { get; set;}
#endregion
#region Constructors
protected ViewController (IntPtr handle) : base (handle)
{
// Note: this .ctor should not contain any initialization logic.
}
#endregion
#region Override Methods
public override void ViewDidLoad ()
{
base.ViewDidLoad ();
// Create new browser and configure it
BrowserViewController = new StickerBrowserViewController (MSStickerSize.Regular);
BrowserViewController.View.Frame = View.Frame;
BrowserViewController.ChangeBackgroundColor (UIColor.Gray);
// Add to view
AddChildViewController (BrowserViewController);
BrowserViewController.DidMoveToParentViewController (this);
View.AddSubview (BrowserViewController.View);
}
#endregion
}
}
Podrobný pohled na tento kód vytvoří úložiště pro vlastní prohlížeč:
public StickerBrowserViewController BrowserViewController { get; set;}
A v ViewDidLoad
metodě vytvoří instanci a nakonfiguruje nový prohlížeč:
// Create new browser and configure it
BrowserViewController = new StickerBrowserViewController (MSStickerSize.Regular);
BrowserViewController.View.Frame = View.Frame;
BrowserViewController.ChangeBackgroundColor (UIColor.Gray);
Pak přidá prohlížeč do zobrazení, aby se zobrazil:
// Add to view
AddChildViewController (BrowserViewController);
BrowserViewController.DidMoveToParentViewController (this);
View.AddSubview (BrowserViewController.View);
Další přizpůsobení nálepky
Další přizpůsobení nálepky je možné zahrnutím pouze dvou tříd do rozšíření aplikace message:
MSStickerView
MSSticker
Pomocí výše uvedených metod může rozšíření podporovat výběr nálepek, který nespoléhá na standardní metodu Nálepka Browser. Kromě toho je možné zobrazení nálepek přepínat mezi dvěma různými režimy zobrazení:
- Kompaktní – toto je výchozí režim, ve kterém zobrazení nálepky zabírá dolů 25 % zobrazení zpráv.
- Rozbalené zobrazení nálepky vyplní celé zobrazení zprávy.
Toto zobrazení nálepky lze přepínat mezi těmito režimy buď prostřednictvím kódu programu, nebo ručně uživatelem.
Podívejte se na následující příklad zpracování přepínání mezi dvěma různými režimy zobrazení. Pro každý stav budou vyžadovány dva různé kontrolery zobrazení. Zpracovává StickerBrowserViewController
kompaktní zobrazení a vypadá takto:
using System;
using System.Collections.Generic;
using UIKit;
using Messages;
using Foundation;
namespace MessageExtension
{
public partial class StickerBrowserViewController : MSStickerBrowserViewController
{
#region Computed Properties
public MessagesViewController MessagesAppViewController { get; set; }
public List<MSSticker> Stickers { get; set; } = new List<MSSticker> ();
#endregion
#region Constructors
public StickerBrowserViewController (MessagesViewController messagesAppViewController, MSStickerSize stickerSize) : base (stickerSize)
{
// Initialize
this.MessagesAppViewController = messagesAppViewController;
}
#endregion
#region Private Methods
private void CreateSticker (string assetName, string localizedDescription)
{
// Get path to asset
var path = NSBundle.MainBundle.PathForResource (assetName, "png");
if (path == null) {
Console.WriteLine ("Couldn't create sticker {0}.", assetName);
return;
}
// Build new sticker
var stickerURL = new NSUrl (path);
NSError error = null;
var sticker = new MSSticker (stickerURL, localizedDescription, out error);
if (error == null) {
// Add to collection
Stickers.Add (sticker);
} else {
// Report error
Console.WriteLine ("Error, couldn't create sticker {0}: {1}", assetName, error);
}
}
private void LoadStickers ()
{
// Load sticker assets from disk
CreateSticker ("add", "Add New Sticker");
CreateSticker ("canada", "Canada Sticker");
CreateSticker ("clouds", "Clouds Sticker");
CreateSticker ("tree", "Tree Sticker");
}
#endregion
#region Public Methods
public void ChangeBackgroundColor (UIColor color)
{
StickerBrowserView.BackgroundColor = color;
}
#endregion
#region Override Methods
public override void ViewDidLoad ()
{
base.ViewDidLoad ();
// Initialize
LoadStickers ();
}
public override nint GetNumberOfStickers (MSStickerBrowserView stickerBrowserView)
{
return Stickers.Count;
}
public override MSSticker GetSticker (MSStickerBrowserView stickerBrowserView, nint index)
{
// Wanting to add a new sticker?
if (index == 0) {
// Yes, ask controller to present add sticker interface
MessagesAppViewController.AddNewSticker ();
return null;
} else {
// No, return existing sticker
return Stickers [(int)index];
}
}
#endregion
}
}
Zpracuje AddStickerViewController
rozbalené zobrazení nálepky a bude vypadat takto:
using System;
using Foundation;
using UIKit;
using Messages;
namespace MessageExtension
{
public class AddStickerViewController : UIViewController
{
#region Computed Properties
public MessagesViewController MessagesAppViewController { get; set;}
public MSSticker NewSticker { get; set;}
#endregion
#region Constructors
public AddStickerViewController (MessagesViewController messagesAppViewController)
{
// Initialize
this.MessagesAppViewController = messagesAppViewController;
}
#endregion
#region Override Method
public override void ViewDidLoad ()
{
base.ViewDidLoad ();
// Build interface to create new sticker
var cancelButton = new UIButton (UIButtonType.RoundedRect);
cancelButton.TouchDown += (sender, e) => {
// Cancel add new sticker
MessagesAppViewController.CancelAddNewSticker ();
};
View.AddSubview (cancelButton);
var doneButton = new UIButton (UIButtonType.RoundedRect);
doneButton.TouchDown += (sender, e) => {
// Add new sticker to collection
MessagesAppViewController.AddStickerToCollection (NewSticker);
};
View.AddSubview (doneButton);
...
}
#endregion
}
}
Implementuje MessageViewController
tyto kontrolery zobrazení pro řízení požadovaného stavu:
using System;
using UIKit;
using Messages;
namespace MessageExtension
{
public partial class MessagesViewController : MSMessagesAppViewController
{
#region Computed Properties
public bool IsAddingSticker { get; set;}
public StickerBrowserViewController BrowserViewController { get; set; }
public AddStickerViewController AddStickerController { get; set;}
#endregion
#region Constructors
protected MessagesViewController (IntPtr handle) : base (handle)
{
// Note: this .ctor should not contain any initialization logic.
}
#endregion
#region Public Methods
public void PresentStickerBrowser ()
{
// Is the Add sticker view being displayed?
if (IsAddingSticker) {
// Yes, remove it from view
AddStickerController.RemoveFromParentViewController ();
AddStickerController.View.RemoveFromSuperview ();
}
// Add to view
AddChildViewController (BrowserViewController);
BrowserViewController.DidMoveToParentViewController (this);
View.AddSubview (BrowserViewController.View);
// Save mode
IsAddingSticker = false;
}
public void PresentAddSticker ()
{
// Is the sticker browser being displayed?
if (!IsAddingSticker) {
// Yes, remove it from view
BrowserViewController.RemoveFromParentViewController ();
BrowserViewController.View.RemoveFromSuperview ();
}
// Add to view
AddChildViewController (AddStickerController);
AddStickerController.DidMoveToParentViewController (this);
View.AddSubview (AddStickerController.View);
// Save mode
IsAddingSticker = true;
}
public void AddNewSticker ()
{
// Switch to expanded view mode
Request (MSMessagesAppPresentationStyle.Expanded);
}
public void CancelAddNewSticker ()
{
// Switch to compact view mode
Request (MSMessagesAppPresentationStyle.Compact);
}
public void AddStickerToCollection (MSSticker sticker)
{
// Add sticker to collection
BrowserViewController.Stickers.Add (sticker);
// Switch to compact view mode
Request (MSMessagesAppPresentationStyle.Compact);
}
#endregion
#region Override Methods
public override void ViewDidLoad ()
{
base.ViewDidLoad ();
// Create new browser and configure it
BrowserViewController = new StickerBrowserViewController (this, MSStickerSize.Regular);
BrowserViewController.View.Frame = View.Frame;
BrowserViewController.ChangeBackgroundColor (UIColor.Gray);
// Create new Add controller and configure it as well
AddStickerController = new AddStickerViewController (this);
AddStickerController.View.Frame = View.Frame;
// Initially present the sticker browser
PresentStickerBrowser ();
}
public override void DidTransition (MSMessagesAppPresentationStyle presentationStyle)
{
base.DidTransition (presentationStyle);
// Take action based on style
switch (presentationStyle) {
case MSMessagesAppPresentationStyle.Compact:
PresentStickerBrowser ();
break;
case MSMessagesAppPresentationStyle.Expanded:
PresentAddSticker ();
break;
}
}
#endregion
}
}
Když uživatel požádá o přidání nové nálepky do dostupné kolekce, zpřístupní se nový AddStickerViewController
kontroler a zobrazení nálepky přejde do rozšířeného zobrazení:
// Switch to expanded view mode
Request (MSMessagesAppPresentationStyle.Expanded);
Když uživatel zvolí nálepku, kterou chcete přidat, přidá se do dostupné kolekce a vyžádá se kompaktní zobrazení:
public void AddStickerToCollection (MSSticker sticker)
{
// Add sticker to collection
BrowserViewController.Stickers.Add (sticker);
// Switch to compact view mode
Request (MSMessagesAppPresentationStyle.Compact);
}
Metoda je přepsána DidTransition
pro zpracování přepínání mezi těmito dvěma režimy:
public override void DidTransition (MSMessagesAppPresentationStyle presentationStyle)
{
base.DidTransition (presentationStyle);
// Take action based on style
switch (presentationStyle) {
case MSMessagesAppPresentationStyle.Compact:
PresentStickerBrowser ();
break;
case MSMessagesAppPresentationStyle.Expanded:
PresentAddSticker ();
break;
}
}
Shrnutí
Tento článek obsahuje rozšíření aplikace zpráv v řešení Xamarin.iOS, které se integruje s aplikací Messages a prezentuje uživatelům nové funkce. Probírané rozšířením k odesílání textu, nálepek, mediálních souborů a interaktivních zpráv.