|
|
@@ -0,0 +1,83 @@
|
|
|
+import React , {useState}from 'react';
|
|
|
+// import Tab from '../navigation/TabNavigator';
|
|
|
+import C from 'rn-class'
|
|
|
+import Main from '../pages/_6_Main'
|
|
|
+import _ from 'lodash'
|
|
|
+
|
|
|
+C.addColor("#c0bb97CC", "color-btnbg-non")
|
|
|
+C.addColor("#eec026", "color-btnbg-last")
|
|
|
+C.addColor("#c0bb97", "color-btnbg-sel")
|
|
|
+
|
|
|
+const BTNS = [
|
|
|
+ [
|
|
|
+ {title: "行" , subtitle : "working \nmeditation"},
|
|
|
+ {title: "住" , subtitle : "standing \nmeditation"},
|
|
|
+ {title: "坐" , subtitle : "seat and \nmeditation"},
|
|
|
+ {title: "卧" , subtitle : "Lying \nmeditation"},
|
|
|
+ {title: "身" , subtitle : "body"},
|
|
|
+ ],
|
|
|
+ [
|
|
|
+ {title:"사랑", subtitle : "Love", contens:"우리는 우리와 가까운, 우리가 원하는, 우리가 좋아하는, 우리를 편리하게 해 주고 행복하게 해 주던 많은 것들과 이별을 해야 하는 괴로움을 버려야 합니다.", img : require("../res/Working_meditation.png")},
|
|
|
+ {title:"미움", subtitle : "Hate", contens:"싫어하는 것을 해야 하는 것, 싫어하는 사람과 함께 있는 것이란 얼마나 큰 괴로움인가. 이는 가장 큰 괴로움이며 여기서 벗어나야 합니다.", img : require("../res/Standing_meditation.png")},
|
|
|
+ {title:"탐욕", subtitle : "Avarice", contens:"좋아하는 사람, 물건, 재산, 명예, 권력, 지위, 출세, 행복, 건강 등 얻고자 하고 바라지만 마음대로 구할 수 없는데서 괴로움은 시작된다.", img : require("../res/Seatand_meditation.png")},
|
|
|
+ {title:"탐식", subtitle : "Voracity", contens:"현대사회에서 물질적 풍요와 상반되게 정신적 빈곤으로 인한 강박장애, 불안장애 같은 정신적 증상은 얻고자 하는 욕심으로 인하여 나타나는 화병의 일환", img : require("../res/Lying_meditation.png")},
|
|
|
+ {title: "心" , subtitle : "Mind"},
|
|
|
+ ]
|
|
|
+]
|
|
|
+
|
|
|
+export default (props)=>{
|
|
|
+ let [ sel_idx, setsel_Idx ] = useState(-1);
|
|
|
+ let [ targetIdx, setTargetIdx ] = useState(0);
|
|
|
+ let btns = BTNS[targetIdx];
|
|
|
+
|
|
|
+ _.forEach(btns, (obj, idx)=>{
|
|
|
+ if(idx == sel_idx){
|
|
|
+ obj["color"] = "bgc-color-btnbg-sel";
|
|
|
+ }else if(btns.length -1 == idx){
|
|
|
+ obj["color"] = "bgc-color-btnbg-last";
|
|
|
+ }else{
|
|
|
+ obj["color"] = "bgc-color-btnbg-non";
|
|
|
+ }
|
|
|
+ });
|
|
|
+ let onTabPress= ( obj, idx )=>{
|
|
|
+ console.log(btns.length-1 , "[0" ,idx);
|
|
|
+ if(idx == btns.length-1){
|
|
|
+ setTargetIdx(targetIdx^1);
|
|
|
+ setsel_Idx(-1);
|
|
|
+ }else{
|
|
|
+ setsel_Idx(idx);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ return (
|
|
|
+ <C.View cls="flx0.1 bgc-color-white flx-row ai-e jc-sa">
|
|
|
+ {
|
|
|
+ Object.keys(btns).map((obj, idx) => {
|
|
|
+ return (
|
|
|
+ <C.TouchableOpacity key={`tab_${idx}`} cls="flx1 ma0.4" onPress={onTabPress.bind(this, obj, idx)}>
|
|
|
+ <C.View cls={`ai-c jc-c h95% ${btns[obj].color}`}>
|
|
|
+ <C.Text cls="ta-c f2" allowFontScaling={false}>
|
|
|
+ {btns[obj].title}
|
|
|
+ </C.Text>
|
|
|
+ <C.Text cls="f1.5 ta-c color-white" allowFontScaling={false}>
|
|
|
+ {btns[obj].subtitle}
|
|
|
+ </C.Text>
|
|
|
+ </C.View>
|
|
|
+
|
|
|
+ </C.TouchableOpacity>
|
|
|
+ )
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ {/* <C.EL.Button ccls="flx1 mh0.2" title="住"/>
|
|
|
+ <C.EL.Button ccls="flx1 mh0.2" title="坐"/>
|
|
|
+ <C.EL.Button ccls="flx1 mh0.2" title="卧"/>
|
|
|
+ <C.EL.Button ccls="flx1 mh0.2" title="身"/> */}
|
|
|
+
|
|
|
+
|
|
|
+ </C.View>
|
|
|
+ )
|
|
|
+
|
|
|
+
|
|
|
+}
|
|
|
+
|
khjde1207