公開日:2019/08/24最終更新日:2019/08/27最初、スタイルを調整していく中でちょっとした違和感や、ちょっと詰まったところがあったので、紹介します。スタイル今後やっていくにつれて新しい発見やつまるところがあると思うので、その都度更新していきます。flexこれは慣れるまでは結構大変です。細かく説明していきます。flexとはざっくり説明すると、要素に占める割合のことだと思ってください。先に共通のスタイルを決めておきます。center;}</style>要素を2分割したい場合は以下のようになります。</view></template>要素を2対1に分割したい場合は以下のようになります。</view></template>これでなんとなく要素に占める割合ということがわかったでしょうか?この場合flex:1の中にflex:2とflex:1があるので2:1で分割されます。それでは高さ(height)を指定した要素があった場合どうなるでしょう。</view></template>みてわかる通り、高さheight:200は固定で、残りの要素を1:2で分割しています。癖がありますが、なんとなくわかっていただけたと思います。このような1つめ以降の単語の頭文字が大文字になっている形のもののことです。言語で、変数名や関数名なんかに使われています。BackgroundColorのように1つ目の単語の頭文字が大文字になっているものはアッパーキャメルケースと呼ばれ、PHPのクラス名なんかで使われたりします。background_colorのように_(アンダースコア)で単語をつなぐものをスネークケースと呼び、Mysqlなどのデータベースのテーブル名やフィールド名などで使用されたりします。Nativeのテンプレート部分ではこのローワーキャメルケースを使用します。Nativeはhtml要素のように、要素にclassを指定してそのクラスにスタイルを当てることができます。そのクラスには普通のcssの書き方でスタイルを当てることができます。Nativeは最初は記述方法が混同してスペルミスで変更が反映されなかったりするかもしれませんが、慣れれば大丈夫です。テンプレート側とstyle側どちらが優先されて適応されるのか?それは、テンプレート側に直接書き込んだ方が優先されて適応されます。pink;}</style>この場合、テンプレート側でblueが、pinkというクラスがstyle側でbackground-color:pinkとして指定されています。この結果が、このようになり、blueが表示されています。テンプレート側のスタイルが優先的に適応されます。html,cssのようにクラスを指定することができるのでstyleの記述量が減るのはいいのですが、一箇所だけ適応させたい場合、テンプレートで直接スタイルを指定すると、予期せぬデザインになったりするので、慎重にスタイルを当てるようにしましょう。まとめこれらは慣れてしまえば簡単なので、触って感覚をつかめば大丈夫です。いくつか詰まる場所があるのですが、まとまり次第追記します。part.1.htaccessのできることについてまとめる。Native】TabNavigatorのオプションまとめプロフィールこのサイトを運営しているイノカワです。静岡でフリーランスをやっています。コードを書くのが大好き。いろんな技術に触れて日々気づいたこと・感じたこと・詰まったこと・生活のことを書いています。技術においては雑食です。