Öğretici: bir fotoğraftan içerikle modern okuyucu Başlatan bir iOS uygulaması oluşturma (Swift)Tutorial: Create an iOS app that launches the Immersive Reader with content from a photo (Swift)

Tam ekran okuyucu , okuma kavramasını geliştirmek için kendini kanıtlamış teknikler uygulayan, ve dahil tasarlanmış bir araçtır.The Immersive Reader is an inclusively designed tool that implements proven techniques to improve reading comprehension.

Görüntü İşleme bilişsel Hizmetler okuma API 'si , Microsoft 'un en son tanıma modellerini kullanarak bir görüntüdeki metin içeriğini algılar ve tanımlanan metni makine tarafından okunabilen bir karakter akışına dönüştürür.The Computer Vision Cognitive Services Read API detects text content in an image using Microsoft's latest recognition models and converts the identified text into a machine-readable character stream.

Bu öğreticide, sıfırdan bir iOS uygulaması oluşturacaksınız ve okuma API 'SI ile modern okuyucu kullanarak tam ekran okuyucu SDK 'sını tümleştirirsiniz.In this tutorial, you will build an iOS app from scratch and integrate the Read API, and the Immersive Reader by using the Immersive Reader SDK. Bu öğreticinin tam bir çalışma örneğine buradanulaşabilirsiniz.A full working sample of this tutorial is available here.

Azure aboneliğiniz yoksa başlamadan önce ücretsiz bir hesap oluşturun.If you don't have an Azure subscription, create a free account before you begin.

Ön koşullarPrerequisites

  • XcodeXcode
  • Azure Active Directory kimlik doğrulaması için yapılandırılmış bir tam ekran okuyucu kaynağı.An Immersive Reader resource configured for Azure Active Directory authentication. Kurulumunu yapmak için Bu yönergeleri izleyin.Follow these instructions to get set up. Örnek proje özellikleri yapılandırılırken burada oluşturulan bazı değerler gerekir.You will need some of the values created here when configuring the sample project properties. Daha sonra başvurmak üzere oturumunuzun çıkışını bir metin dosyasına kaydedin.Save the output of your session into a text file for future reference.
  • Bu örneğin kullanımı, Görüntü İşleme bilişsel hizmet hizmetine bir Azure aboneliği gerektirir.Usage of this sample requires an Azure subscription to the Computer Vision Cognitive Service. Azure Portal bir görüntü işleme bilişsel hizmet kaynağı oluşturun.Create a Computer Vision Cognitive Service resource in the Azure portal.

Xcode projesi oluşturmaCreate an Xcode project

Xcode 'da yeni bir proje oluşturun.Create a new project in Xcode.

Yeni Proje

Tek görünüm uygulaması' nı seçin.Choose Single View App.

Yeni tek görünüm uygulaması

SDK CocoaPod edinmeGet the SDK CocoaPod

Tam ekran okuyucu SDK 'sını kullanmanın en kolay yolu CocoaPods aracılığıyla yapılır.The easiest way to use the Immersive Reader SDK is via CocoaPods. Cocoapods aracılığıyla yüklemek için:To install via Cocoapods:

  1. Install Cocoapods -Cocoapods yüklemek için Başlarken Kılavuzunu izleyin.Install CocoaPods - Follow the getting started guide to install Cocoapods.
  2. Xcode projenizin kök dizininde pod init çalıştırarak bir pod dosyası oluşturun.Create a Podfile by running pod init in your Xcode project's root directory.
  3. pod 'immersive-reader-sdk', :path => 'https://github.com/microsoft/immersive-reader-sdk/tree/master/iOS/immersive-reader-sdk'ekleyerek Pod dosyanıza CocoaPod ekleyin.Add the CocoaPod to your Podfile by adding pod 'immersive-reader-sdk', :path => 'https://github.com/microsoft/immersive-reader-sdk/tree/master/iOS/immersive-reader-sdk'. Pod dosyanız, hedefin adı ile tam ekran-------Swift arasında değişmeli şekilde aşağıdaki gibi görünmelidir:Your Podfile should look like the following, with your target's name replacing picture-to-immersive-reader-swift:
 platform :ios, '9.0'

 target 'picture-to-immersive-reader-swift' do
 use_frameworks!
 # Pods for picture-to-immersive-reader-swift
 pod 'immersive-reader-sdk', :path => 'https://github.com/microsoft/immersive-reader-sdk/tree/master/iOS/immersive-reader-sdk'
 end
  1. Terminalde, Xcode projenizin dizininde, derinlikli Okuyucu SDK Pod ' ı yüklemek için pod install komutunu çalıştırın.In the terminal, in the directory of your Xcode project, run the command pod install to install the Immersive Reader SDK pod.
  2. SDK 'ya başvurması gereken tüm dosyalara import immersive_reader_sdk ekleyin.Add import immersive_reader_sdk to all files that need to reference the SDK.
  3. .xcodeproj dosyasını değil .xcworkspace dosyasını açarak projeyi açmanız emin olun.Ensure to open the project by opening the .xcworkspace file and not the .xcodeproj file.

Azure AD kimlik doğrulaması belirteci almaAcquire an Azure AD authentication token

Bu bölüm için yukarıdaki Azure AD kimlik doğrulama yapılandırması önkoşul adımından bazı değerlere ihtiyacınız vardır.You need some values from the Azure AD authentication configuration prerequisite step above for this part. Bu oturumu kaydettiğiniz metin dosyasına geri bakın.Refer back to the text file you saved of that session.

TenantId     => Azure subscription TenantId
ClientId     => Azure AD ApplicationId
ClientSecret => Azure AD Application Service Principal password
Subdomain    => Immersive Reader resource subdomain (resource 'Name' if the resource was created in the Azure portal, or 'CustomSubDomain' option if the resource was created with Azure CLI Powershell. Check the Azure portal for the subdomain on the Endpoint in the resource Overview page, for example, 'https://[SUBDOMAIN].cognitiveservices.azure.com/')

ViewController. Swift dosyasını içeren ana proje klasöründe, sabitler. Swift adlı bir Swift sınıfı dosyası oluşturun.In the main project folder, which contains the ViewController.swift file, create a Swift class file called Constants.swift. Sınıfı aşağıdaki kodla değiştirin ve uygun olduğunda değerlerinize ekleyin.Replace the class with the following code, adding in your values where applicable. Bu dosyayı yalnızca makinenizde bulunan yerel bir dosya olarak tutun ve bu dosyayı kaynak denetimine kaydetmediğinden emin olun. bu dosya, genel hale getirilmemelidir.Keep this file as a local file that only exists on your machine and be sure not to commit this file into source control, as it contains secrets that should not be made public. Uygulamanızda gizli dizileri tutmanız önerilir.It is recommended that you do not keep secrets in your app. Bunun yerine, belirteci almak için bir arka uç hizmeti kullanmanızı öneririz; burada gizli dizi, uygulamanın dışında ve cihazın dışında tutulabilir.Instead, we recommend using a backend service to obtain the token, where the secrets can be kept outside of the app and off of the device. Yetkisiz kullanıcıların, bir dizi kimlik doğrulama (örneğin, OAuth) arkasında güvenli hale getirilmesi gerekir, bu da yetkisiz kullanıcıların, tam ekran okuyucusu hizmetinize ve faturalandırmaya yönelik belirteçleri kullanmasını önler; Bu iş, Bu öğreticinin kapsamı dışındadır.The backend API endpoint should be secured behind some form of authentication (for example, OAuth) to prevent unauthorized users from obtaining tokens to use against your Immersive Reader service and billing; that work is beyond the scope of this tutorial.

Uygulamayı görsel taslak olmadan çalışacak şekilde ayarlamaSet up the app to run without a storyboard

AppDelegate. Swift dosyasını açın ve dosyayı aşağıdaki kodla değiştirin.Open AppDelegate.swift and replace the file with the following code.

Fotoğraf alma ve karşıya yükleme işlevlerini eklemeAdd functionality for taking and uploading photos

ViewController. Swift ' i PictureLaunchViewController. Swift olarak yeniden adlandırıp dosyayı aşağıdaki kodla değiştirin.Rename ViewController.swift to PictureLaunchViewController.swift and replace the file with the following code.

Uygulamayı derleme ve çalıştırmaBuild and run the app

Bir simülatör veya cihaz hedefi seçerek Xcode 'da arşiv şemasını ayarlayın.Set the archive scheme in Xcode by selecting a simulator or device target. Arşiv şeması Archive scheme
Hedef seçinSelect Target

Xcode 'da, CTRL + R tuşlarına basın veya projeyi çalıştırmak için Yürüt düğmesine tıklayın ve uygulamanın belirtilen simülatör veya cihazda başlatılması gerekir.In Xcode, press Ctrl + R or click on the play button to run the project and the app should launch on the specified simulator or device.

Uygulamanızda şunları görmeniz gerekir:In your app, you should see:

Örnek uygulama

Uygulamanın içinde, "fotoğrafı al" düğmesine veya ' kitaplıktan fotoğraf seç ' düğmesine basarak bir metin fotoğrafı alın veya karşıya yükleyin. böylece, tam ekran okuyucu daha sonra fotoğraftan metni görüntülemeye başlar.Inside the app, take or upload a photo of text by pressing the 'Take Photo' button or 'Choose Photo from Library' button and the Immersive Reader will then launch displaying the text from the photo.

Tam Ekran Okuyucu

Sonraki adımlarNext steps