ホームページ >ウェブフロントエンド >htmlチュートリアル >Android アニメーションを学習するにはどうすればよいですか? _html/css_WEB-ITnose

Android アニメーションを学習するにはどうすればよいですか? _html/css_WEB-ITnose

WBOY
WBOYオリジナル
2016-06-21 08:58:571223ブラウズ

Android 開発者の Web サイトで「アニメーション」を検索し、「ブログ」で検索結果をフィルタリングすると、最初の 2 ページのみを抜粋して 2 つのカテゴリに分けました。アニメーションはどのようなものですか (カテゴリ 1)

次のブログ投稿では、開発者に次の 3 つの側面から「アニメーション」を示します:

  • いくつかの指針を示し、アニメーション化する理由を説明します。この方法、またはそのようなアニメーションの利点は何ですか。

  • アニメーションが何であるかを視覚的に示すために

  • を与えます。このアニメーションを実装するコード スニペット (主要なクラス、メソッド、リソース ファイル) または実装アイデア。

    ​​

これは非常に優れており、アニメーションの印象をすばやく確立するのに役立ちます。特定の名詞で表されるアニメーションがどのようなものであり、それをどのように実装するか。また、多くのコード スニペットはオープン ソース プロジェクトから抜粋されているため、これらのアニメーションをデバッグできます。

2014-08-05 2014 Google I/O アプリのマテリアル デザイン

この記事の著者は Google I/O アプリのチーフ デザイナーであり、I/ O アプリの役割の 1 つは、

Android の設計と開発のベスト プラクティスを提供することです (Android の設計と開発のベスト プラクティスの参照デモとして機能します)。この記事では特に について言及しています。私のお気に入りのアプリの詳細の 1 つはアニメーション に関連しています。つまり、フローティング アクション ボタンの状態は、「ユーザーが現在のページでこの会議に参加するかどうか」に基づいて変化します。アニメーションによって。この記事ではアニメーションの実装手順について詳しく説明していますが、コードはリストされていませんが、実装の詳細を理解するには github-google-io-app からソース コードを入手できます。

2014-10-24 Android アプリにマテリアル デザインを実装する

この記事の半分は

『モーション』についてです: ユーザーが画面に触れるとすべてが変化します。接触点から始まり、外側に放射状に広がり、画像の変遷につながりと連続性を確立する 、これらは有意義で親しみやすいものでなければなりません。マテリアルは、このようにユーザーにフィードバックを提供し、変化に気づくようにすることでユーザーを支援します。 (注意を集中させ、空間関係を確立し、連続性を維持するため。マテリアルはタッチに反応してユーザーのインタラクションを確認し、すべての変化がタッチポイントから外側に放射状に広がります。すべての動きは意味があり、親密なものであり、ユーザーの理解を助けます。)それぞれ紹介します:

  • アクティビティとフラグメントの遷移: 2 つのページ間のスムーズな遷移は、リスト ビューから詳細ビューに切り替えることです。 >

  • Ripples
  • : 波紋は、ビュー全体を満たすまで接触点から外側に広がります。この効果は、Theme.material から継承されたボタンをクリックすると確認できます。

  • StateListAnimator
  • : ビューの状態が変化するときのアニメーション

  • Circular Reveal
  • : 1 つ円形のセクターは、ビュー全体を満たすまで接触点から外側に放射状に広がります。このトランジション効果は、新しいコンテンツを表示するためによく使用されます。

    インターポレーター

    :アニメーションが変化する速度 (アルファ、スケール、平行移動、回転による加速、減速、繰り返しなどを許可するなど)。たとえば、補間器 fast_out_slow_in は加速を開始し、終了するまで徐々に減速します。このアニメーション効果により、オブジェクトはモーション軌跡全体の終点付近でより多くの時間を費やします。さまざまなシーンに応じて、異なるインターポレーターまたはカスタム インターポレーターを選択すると、アニメーションをより意味のあるものにし、同じ印象を取り除くことができます。
  • 2015-05-28 マテリアル デザイン ショーケースと賞の発表

    この記事では、2014 年 6 月に初めて発表されたときのマテリアル デザインのビジョンを初めてレビューします
  • 『プラットフォームやブランドを超えて機能する単一のデザイン システム』
。しかし、これらのビジョンとマテリアル デザインの設計思想はすべて「架空のアプリ」を通じて実証されます。その後、この記事が公開された 2015 年 5 月に世界は変わり、多くのアプリが Android 5.0 SDK と AppCompat を通じてマテリアル デザインを受け入れ、実装しました。

そこで、マテリアル デザインに準拠した 18 個のアプリを特別に集め、そのアニメーション効果により、そのうち 6 個がマテリアル デザインの特定の側面で優れたパフォーマンスを発揮したとして、第 1 回マテリアル デザイン賞を受賞しました。優勝者は Tumblr: Delightful Animation です。

どのようなアニメーション効果を作成できるか、公式は Tumblr をチェックするように言っています。

2015-06-16 Topeka によるその他のマテリアル デザインAndroid
この記事は、オープンソース Android アプリ プロジェクト Topeka for Android のドキュメントです。この記事は、マテリアル デザインの設計原則を実証

し、開発者がさまざまなプラットフォームで統合ユーザーを構築するのに役立ちます。経験。 (原文: 同じブランディングとマテリアル デザインの原則を使用して、プラットフォーム間で一貫したエクスペリエンスを作成できることを示しています。)

Topeka は、グリッド レイアウトで表示される 9 種類の質問を含む楽しい質問と回答のアプリケーションです。質問に回答すると、次の質問に切り替わります。空白を埋める多肢選択問題やその他の種類の問題 (さまざまな UI コンポーネントに対応) があります。多くのアニメーション要素が含まれています:

  • トランジション: アクティビティ間の優れたトランジション

  • アニメーション: アニメーションが慎重に配置されています。質問に回答すると、フローティング操作ボタンが表示され、回答を送信するボタンをクリックすると、回答が正しいかどうかに応じて、対応するアニメーションが再生されます。 ;

  • プロパティ アニメーション: FAB の色から透明へのカラー グラデーション アニメーションを追加すると、円形のリビールを円形に表示するディゾルブのようなエフェクトが作成されます。
    (前の GIF にはこのエフェクトが含まれていますが、速すぎてエフェクトが見えません。次の GIF はアニメーションを強調表示するために時間を延長しています)

アニメーション関連のクラスとインターフェイス ( カテゴリ 2)

2011-05-30 ViewPropertyAnimator の紹介
2011-02-24 ハニカムでのアニメーション
2011-11-01 Android 4.0 グラフィックスとアニメーション

最初の 2 つの記事は、まず質問があります。移動、拡大縮小、回転、フェード ビュー アニメーションを実装できる android.view.animation がすでにあります。 3.0 で新しい API が導入されたのはなぜですか?どのような新機能がもたらされるのでしょうか? 次に、これらの新機能の強力な利便性をさらに実証します。 3 番目の記事では、4.0 が 3.0 のコア機能に追加する小さな改良点について説明します。 (これらの記事では、Android でのアニメーションをより簡単、より強力、より柔軟にする 3.0 で追加された新しい API について説明します。以下で説明する Android 4.0 の改良点は、これらのコア機能への小さな追加です。)

これらの記事はランク付けされています。最初のいくつかの検索結果は、その重要性を示しています。著者は、グラフィックスとアニメーションの研究を専門とする Android 開発者です。彼の個人ブログ graphics-geek.blogspot.com から、関連トピックに関するその他のブログ投稿を読むことができます。

HONEYCOMB 3.0 (バージョン android-3.0 のハイライトについて) は 2011.02 にリリースされ、新しいアニメーション フレームワークが導入されました。3.1 は 2011.05 にリリースされ、ICE_CREAM_SANDWICH 4.0 は 2011.11 にリリースされました。 これらのブログ投稿のリリース時間は、対応するシステム バージョンのリリース時間と一致しています。そのうち 2 つは Android API ガイド: アニメーションとグラフィックスのページで推奨されているため、 より注意を払う必要があります。公式開発者記事 にアクセスして学習してください。

2015-04-21 Android サポート ライブラリ 22.1
この記事では、Android サポート ライブラリ 22.1 バージョンによってもたらされる新機能を紹介します。アニメーション関連のコンテンツは次のとおりです。 Lollipop android.R.interpolator いくつかの新しい補間器がサポート V4 でサポートされています。

上記の記事を読み進めると、「アニメーションとはどのようなものを作ることができるのか」「アニメーションを実装するクラスやインターフェース、技術の進化の歴史」を理解できるようになります。自分が高い立場に立って戦略を練っていると感じますか? Android ドキュメントの海に溺れたり、膨大な数の技術的な詳細に混乱したりすることはないと思います。また、デモを学習するときは、それほどスキルが必要ではないと感じます。そのため、上記の公式記事の公式サンプルとデモから始めて、API ガイドも確認する必要があります:

Android Training & Guides

Android 開発者 Web サイトから提供されます。 トレーニング:
シーンとトランジションを使用したビューのアニメーション化
アニメーションの追加
カスタム アニメーションの定義

Android 開発者 Web サイトから提供される API ガイド:
アニメーションとグラフィックの概要

公式サンプルを入手するにはさまざまな方法があります: Android Studio に直接インポートするなど、Android 開発者向けのコード サンプルへようこそ:

学習ロードマップ

以下のような非公式ブログ投稿:
Exploring Meaningful Motion on Android、これは Exploring Meaningful Motion on Android の翻訳です。これは、記事に対応するオープン ソース プロジェクト hitherejoe/animate です (星 1280 個)。
同様のオープンソース プロジェクト lgvalle/マテリアルアニメーション、3840 個のスター。

しかし、直接的で信頼できる観点から、特定の知識ポイントを体系的に学ぶ必要がある場合は、開発者にとって公式 Web サイトとそのブログが最適です。英語のドキュメントを読むのに費やす時間は気にしないでください。それだけの価値は十分にあります。理解できない場合は、関連記事でサポートを確認してください。

そこで、私はこの記事を編集し、学習ロードマップを作成するのに約 3 日を費やしました。

  • 公式ブログ (上記) を読んでください。

  • 公式トレーニングを学ぶ (上記にリスト);

  • GitHub の高評価 (興味深い) プロジェクト (多くの人が非常に優れたプロジェクトを推奨している) を学ぶ

  • 他の質の高いブログを読んでギャップを確認してください (Google を活用してください); Go! Go! li21 SH 2016- 01-16 ~ 2016-01- 23

  • 声明:
    この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。