todolist

react-本機の練習のためにtodolistを作成しました
(注:https://catchdream.tistory.com/180?category=829219)

アップルの携帯の手帳を真似したいです.既存の反応とラベルの名前が違うのは見慣れないけど面白い(クローンコードはいつも面白いのは秘密です)

react-native tag

SafeAreaView

reactはrender時に出力値をラベルで包む必要があります.
react-ローカルレンダリング時にもタグを出力する必要があります.そのキャラクターはSafeAreaView TAGで私のセキュリティエリアに属するTAGを決定しますか?そう思えばいいほほほ、でもviewタグだけでも同じ形で出力しますが、何が違うのか分かりません.もう一度探してみる必要がある

flatlist

リスト内の機能の代わりにflatlistタグを使用してコメントリストを表示しました.renderItemを使用すると、for文のようにstateとして保存されているリストを迂回し、todoitemタグに値を指定できます.

TouchableOpacity

buttonラベルがありますが、iosとandroidで異なる形式で出力される可能性があります.しかしながら、TouchableOpacityタグはiosおよびandroidにおいて同様の形状で出現し、ボタンタグの動作と同様である.iosとandroidの2つの場所でアプリケーションを作成する予定なので、TouchableOpacityラベルを使って練習します.
設定値にはactiveOpacityがあります.これにより、ボタンをクリックしたときに不透明度の値を設定できます.通常は0.8を値に設定します.これは自由です.

text

ハードコーディングでは、たとえば[削除](Delete)ボタンに[削除](Delete)と入力すると、テキストタグを使用して作成します.

StyleSheet

cssを適用するときにスタイルシートを使用します.

const styles = StyleSheet.create({
	container: {
    flex: 1,
    paddingTop: 20,
    paddingLeft:20,
    paddingRight:20,
    backgroundColor: '#E5E5E5',
    justifyContent: 'flex-start',
  },
  subcontainer:{
    borderRadius:8,
    marginTop: 20,
    marginLeft:20,
    marginRight:20,
    backgroundColor: '#FFFFFF',
  }
})

例としてcssを作成します.<View style={styles.subcontainer}>は、この形態を採用することができる.

Modal

下に赤い包みの箱がモデール窓です.実際の携帯でシミュレーションしていると見えません.+キーを押すとモードウィンドウがポップアップするように設定しました.

Swipeable

削除機能にはSwipeableタグが使用されています.Swipeableタグは、指定された値を左、右に押すときの動作を設定することができる.renderRightActions機能を設定し、右から左にスライドしたときに削除ボタンを表示するようにしました.

その他の機能が作成されます。

反応と形式は非常に似ている.でもほとんどブログ通りに作られているので、自分で作ると迷います.そこで、自分の機能の追加と自分の機能の作成を練習するために、固定コメント機能を追加する予定です.
この機能を使用すると、左から右にアノテーションを押すことができます(消去可能-レンダリング延長アクション機能を使用します)、ピンのシェイプを表示するボタン、およびこのボタンをクリックすると、固定アノテーションというサブタイトルに値が移動します.iPhoneに固定されている備考機能と同じです.