30分でiOS用の「リーダー」を書く方法

準備なしで高速読み取りQuisyReaderと1分あたり500ワードの投稿を読んで、私はAppleのスマートフォン用にこのアイデアを自分で実装したかったのです。 これを行うために、 githubに公開されているソースコードであるAPIを開発しました。











APIの機能の原理と、それに基づいて高速読み取り用のプログラムを作成する方法については、以下で説明します。

どのように機能しますか？

作成されたAPIの基礎は、Spritzの原則と、単語の色付けと配置の方法に基づいています。

最初に、APIは毎秒数回起動する繰り返しタイマーを開始します。 タイマーは、データソースから描画する次の単語を要求するメソッドを呼び出します。 希望する単語を受け取った後、色付けする文字の位置を見つける必要があります。 実証研究を使用して、文字が次のように色付けされていることを確認できました。

• 語長1。文字1。
• 語長は2〜5です。 色付きの手紙2。
• 語長は6〜9です。 色付きの手紙3。
• など

したがって、目的の文字の位置は、最も簡単な式で計算されます。

(([word length] + 6) / 4) - 1;
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

位置がわかったら、NSAttributedStringを使用して文字を異なる色に色付けします。メインワードには黒、アクセント付き文字には赤です。

ここで、目的の文字の中心の座標を計算する必要があります。 これを行うには、iOSのバージョンに応じて、sizeWithFont：またはsizeWithAttributes：メソッドを使用して文字の幅を計算します。

小さなことについては、UILabelを作成し、NSAttributedStringをそこに入れ、同じメソッドを使用して、選択したフォントに対して計算された幅でフレームを設定します。 結果のUILabelとアクセント付き文字の中心の位置は、RRTargetViewクラスに渡されます。RRTargetViewクラスは、ターゲットのレンダリングに関与し、目的の文字に焦点を合わせ、このターゲット内にUILabelを配置します。

読者を書く

githubで公開されているAPIについてもう少し説明します。これを使用して、タスクを実装します。

RRViewControllerクラスは、描画される文字列の形成を担当します。 このクラスには、次のパブリックプロパティとメソッドがあります。



読み取りを開始/一時停止します。

 - (void)startReading; - (void)pauseReading;
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

負または正の値を送信して、読み取り速度を変更します。 速度は1分あたりの単語数で測定されます。

 - (void)changeSpeed:(int)speedModification;
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

フォントサイズを変更すると、現在のサイズに関連して負または正の値も指定されます。 しきい値は16〜100に設定されます。

 - (void)changeFont:(int)fontModification;
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

RRViewControllerクラスのDelegateおよびDataSourceプロトコルを実装するオブジェクトへの参照を格納する2つのプロパティ。

 @property (nonatomic, weak) id <RRViewControllerDataSource> dataSource; @property (nonatomic, weak) id <RRViewControllerDelegate> delegate;
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

ターゲットのレンダリングとテキストの配置は、UIViewクラスのRIVTargetView継承者によって実行されます。 クラスには、1つのパブリックメソッドと1つのプロパティがあります。

ターゲットに垂直ノッチが描画される0.0から1.0の範囲のポイントを設定します。テキストはこのポイントに対して相対的に配置されます。 デフォルト値は1/3です。

 @property (nonatomic) CGFloat horizontalAccentPosition;
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

このメソッドは、テキスト付きのUILabelを受け入れます。 AccentPointは、垂直ノッチと位置合わせされるポイントです。

 - (void)positionLabel:(UILabel *)label withAccentPoint:(CGPoint)point;
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

画像例





また、2つのプロトコルがあります。

RRViewControllerDelegateプロトコル



どちらの方法もオプションであり、フォントサイズと読み取り速度の変更に関する通知を受け取るために必要です。

 - (void)reportFontSize:(CGFloat)size; - (void)reportReadingSpeed:(NSUInteger)speed;
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

RRViewControllerDataSourceプロトコル

オプションの方法：

 - (NSString *)longestWordWithFont:(UIFont *)font;
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

このメソッドは、テキスト内で最も長い単語をRRViewControllerに返します。自動フォントサイズ選択システムが機能する必要があります。 また、自動テキスト選択システムを機能させるには、[NSUserDefaults standardUserDefaults]のauto_text_sizeキーにブール値YESを設定する必要があります。

 - (NSString *)previousWord;
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

テキストになじみのない単語が見つかり、手動でそれに戻りたい場合に、前の単語を取得する方法。



2つの必須メソッド：

 - (NSString *)nextWord;
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

RRViewControllerは、表示する次の単語のデータモデルを照会します。

 - (NSString *)currentWord;
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

たとえば、テキストを再描画するためにフォントが変更された場合に、現在の単語が要求されます。

---

さて、今あなたの読者を書いてください。

最初に、プロジェクト（シングルビューアプリケーション）を作成し、たとえばSuper Fast Readerなどの調和のとれた名前を付けます。







APIをプロジェクトにエクスポートし、 githubからダウンロードし、テキストのレンダリングを行います。



デフォルトのUIViewControllerが存在するストーリーボードを開きます。 コンテナーをコンテナーに追加します。コンテナーに配置されたコントローラークラスとして、RRViewControllerを指定します。 また、テキストを制御および入力するための要素も必要です。 「開始」、「一時停止」ボタン、テキスト入力フィールドUITextView、UIViewを追加します。これらには、それらをグループ化するためのすべてのコントロールが配置されます。また、コントロールとコンテナーとUIViewを配置するUIScrollViewを追加します。 次に、これらの要素をアプリケーションコードに関連付けます。 UItextViewとUIScrollViewのIBOutletと、開始ボタンと一時停止ボタンのクリックを処理するための2つのIBActionを作成します。

 @property (weak, nonatomic) IBOutlet UITextView *textView; @property (weak, nonatomic) IBOutlet UIScrollView *scrollView; - (IBAction)startReading:(UIButton *)sender; - (IBAction)pauseReading:(UIButton *)sender;
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

ストーリーボードビュー





ビュー階層





RRViewControllerを使用するときが来ました。

最初に行うことは、それへのリンクを取得することです。 コンテナを作成すると、「埋め込みセグエ」が自動的に作成され、InterfaceBuilderを使用してRVCBecomesChildなどの名前を割り当てます。 プログラムの実行時に、RRViewControllerをコンテナに追加すると、prepareForSegue：sender：メソッドが呼び出されます。このメソッドを使用します。



最初に、オブジェクトへの参照が保存されるプロパティを作成します。

 @property (weak, nonatomic) RRViewController *readingVC;
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

次に、メソッドを実装します。

 - (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender { if ([segue.identifier isEqualToString:@"RVCBecomesChild"]) { self.readingVC = segue.destinationViewController; } }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

コントローラーへのリンクがあります。 次は？

そして、RRViewControllerクラスのRRViewControllerDataSourceプロトコルの必要なメソッドを実装する必要があります。

 - (NSString *)nextWord; - (NSString *)currentWord;
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

最初に行う必要があるのは、RRViewControllerにデータソースであることを伝えることです。

 - (void)viewDidLoad { [super viewDidLoad]; self.readingVC.dataSource = self; }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

プロトコルをサポートしていることをコンパイラに伝えることを忘れないでください。

 @interface SFRViewController () <RRViewControllerDataSource>
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

これは、self.readingVC.dataSource = selfを割り当てるときにコンパイラーが警告を出さず、また@requiredとしてマークされたすべてのメソッドが実装されていない場合に警告を受け取るために必要です。



UITextViewフィールドから読み取るテキストを取得し、さらにテキスト内の現在の位置を表示する変数が必要になります。

 @property (nonatomic) NSUInteger currentWord; - (NSString *)nextWord { self.textPosition++; NSArray *words = [self.textView.text componentsSeparatedByCharactersInSet:[NSCharacterSet whitespaceAndNewlineCharacterSet]]; if (self.textPosition >= [words count]) { self.textPosition = 0; } return [words objectAtIndex:self.textPosition]; } - (NSString *)currentWord { NSArray *words = [self.textView.text componentsSeparatedByCharactersInSet:[NSCharacterSet whitespaceAndNewlineCharacterSet]]; if (self.textPosition >= [words count]) { self.textPosition = 0; } return [words objectAtIndex:self.textPosition]; }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

最も合理的な実装ではありません。各単語をクエリするときはテキスト全体を解析するため、テキストを変更するときに一度これを実行し、結果を変数に保存する方がよいためです。 どの方法でこれを実装できるかについては、少し後で説明します。

次に、ボタンのアクションを実装します;このために、RRViewControllerクラスのメソッドを呼び出します。

 - (IBAction)startReading:(UIButton *)sender { [self.readingVC startReading]; } - (IBAction)pauseReading:(UIButton *)sender { [self.readingVC pauseReading]; }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

できた プログラムを実行して結果を楽しむことができます。

それはバグではなく、機能です

速度が非常に遅く、フォントが小さいことがすぐにわかります。 この問題は非常に簡単に解決されます。 RRViewControllerメソッドを呼び出すボタンを作成します。 メソッドへの引数として、これらのパラメーターがどれだけ変化するかを示す負または正の整数が渡されます。

 - (void)changeSpeed:(int)speedModification; - (void)changeFont:(int)fontModification;
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

これらのメソッドの実装はユーザーの裁量に任され、別の問題を解決します。



私たちのプログラムでは、テキストを追加しようとすると、キーボードが入力フィールドと重なり、Enterキーを押してもキーボードがクリアされません（UITextViewを使用して複数行のテキストを入力し、Enterキーを押すと改行文字がテキストに挿入されるため、ただし、この動作は変更できます）。

この問題を解決するには、テキストフィールドから応答を受け取る必要があります。 これを行うには、ViewControllerクラスがUITextViewクラスの代理であり、そのプロトコルを実装していることを彼に知らせます。

 @interface SFRViewController () <RRViewControllerDataSource, UITextViewDelegate>
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

また、キーボードからのメッセージを受信するためにサブスクライブする必要があり、その外観に関するメッセージとともに、現在のサイズを含むディクショナリを受信し、UIScrollViewオフセットを計算する必要があります。

 - (void)viewDidLoad { [super viewDidLoad]; self.readingVC.dataSource = self; self.textView.delegate = self; [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(keyboardWasShown:) name:UIKeyboardWillShowNotification object:nil]; }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

次に、必要な2つのメソッドを実装します。

まず、キーボードが表示されたときに呼び出されるメソッド：

 - (void)keyboardWasShown:(NSNotification *)notification { CGSize keyboardSize = [[[notification userInfo] objectForKey:UIKeyboardFrameBeginUserInfoKey] CGRectValue].size; [self.scrollView setContentInset:UIEdgeInsetsMake(-keyboardSize.height, 0, 0, 0)]; }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

現在、テキストの変更を処理しています。 改行文字「\ n」が挿入されている場合は、キーボードを削除し、UIScrollViewの垂直オフセットを削除します。 ところで、同じメソッドで、テキストの変更時に1回実行されるように、文字列の解析を実装できます。

 - (BOOL)textView:(UITextView *)textView shouldChangeTextInRange:(NSRange)range replacementText:(NSString *)text { if ([text isEqualToString:@"\n"]) { [textView resignFirstResponder]; } return YES; }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

再び始めます。 うまくいく！ 結果を楽しんで、自分のアイデアの実装に取り​​組むことができます。

当然のことながら、この記事ではデータを取得する最も簡単な方法を示しました。より有能な実装の場合、データの解析と提供を行う別のクラスを作成する価値があります。

あとがき

APIは開発/改良段階にあるため、コメントや提案の変更を受け入れるか、リポジトリを分岐して独自の方法で変更を加えることができます。



素敵な読書を！