Переглянути джерело

days display as jauges

master
DemiSel 2 роки тому
джерело
коміт
61b9951a80

+ 12
- 0
components/add_depense.js Переглянути файл

@@ -27,21 +27,33 @@ export default function AddDepense(props){
27 27
 
28 28
 
29 29
 const add_depenses_styles = StyleSheet.create({
30
+    
30 31
     overlay: {
31 32
         height: "100%",
32 33
         width: "100%",
33 34
         position: 'absolute',
35
+        // display:"flex",
36
+        // justifyContent: "center",
37
+        // elevation:10,
34 38
     },
35 39
     
36 40
     button_add: {
37 41
         borderWidth: 1,
42
+        borderRadius: 25,
38 43
         padding: 10,
39 44
         backgroundColor: "#FFFFFF",
40 45
         elevation:5,
46
+        width: "100%",
47
+        height: "100%",
48
+        justifyContent: 'center',
49
+        alignItems: 'center',
50
+        
41 51
     },
42 52
     button_add_parent: {
43 53
         position: 'absolute',
44 54
         bottom: 10,
45 55
         right: 10,
56
+        width:50,
57
+        height:50,
46 58
     }
47 59
 });

+ 5
- 1
components/depense_edit/depense_form.js Переглянути файл

@@ -143,7 +143,8 @@ const depense_form_styles = StyleSheet.create({
143 143
         display: 'flex',
144 144
         flexDirection: 'column',
145 145
         justifyContent: "space-between",
146
-        borderWidth: 1,
146
+        // borderWidth: 5,
147
+        // borderRadius: 5,
147 148
     },
148 149
     form_entry :{
149 150
         display: 'flex',
@@ -152,10 +153,13 @@ const depense_form_styles = StyleSheet.create({
152 153
     input :{
153 154
         width: "50%",
154 155
         borderWidth: 1,
156
+        // borderRadius: 5,
157
+
155 158
         textAlign: 'center',
156 159
     },
157 160
     button_add: {
158 161
         borderWidth: 1,
162
+        // borderRadius: 5,
159 163
         padding: 10,
160 164
         margin: 1,
161 165
     },

+ 4
- 2
components/depenses_list.js Переглянути файл

@@ -141,9 +141,11 @@ function DepensesList(props)
141 141
 
142 142
 
143 143
     return(
144
-    <SafeAreaView >
144
+    <View>
145
+    <SafeAreaView>
145 146
             {content}
146
-    </SafeAreaView >
147
+    </SafeAreaView>
148
+    </View>
147 149
     )
148 150
 }
149 151
 

+ 18
- 4
components/list/day_list.js Переглянути файл

@@ -2,6 +2,7 @@ import React from 'react';
2 2
 import { StyleSheet, Text, View, TextInput, Alert, Pressable } from 'react-native';
3 3
 import DepenseListEntry from '../depense_list_entry';
4 4
 import { strLPad } from '../../utils/util';
5
+import { LinearGradient } from 'expo-linear-gradient';
5 6
 
6 7
 export default function DayList(props)
7 8
 {
@@ -22,7 +23,8 @@ export default function DayList(props)
22 23
         )
23 24
         total += depense.value;
24 25
     });
25
-    
26
+    let scale = Math.min(1, total/props.dailyObjective)
27
+
26 28
 
27 29
     let result = props.dailyObjective - total 
28 30
     let text_color = "#000000";
@@ -36,6 +38,12 @@ export default function DayList(props)
36 38
 
37 39
     return (
38 40
         <View style={[day_list_styles.day_list_container, {backgroundColor: bg_color}, isCurrentday ? day_list_styles.current_day_container : null]}>
41
+            <LinearGradient
42
+                colors={[scale > 0 ? '#FFDDDDFF' : '#FFFFFF','#FFFFFF', '#FFFFFF']}
43
+                locations={[scale, scale+0.05, 1]}
44
+                end={{x:1,y:0}}
45
+                style={day_list_styles.background}
46
+            />
39 47
             <Pressable 
40 48
                 style={day_list_styles.day_list_entry}
41 49
                 onPress={() => {onToggleDepenses(!showDepenses)}}>
@@ -52,9 +60,10 @@ export default function DayList(props)
52 60
 const day_list_styles = StyleSheet.create({
53 61
     day_list_container: {
54 62
         // borderWidth: 1,
55
-        margin: 1,
56
-        marginTop: 15,
57
-        elevation: 5,
63
+        // margin: 1,
64
+        // marginTop: 5,
65
+        // marginBottom: 15,
66
+        // elevation: 5,
58 67
         
59 68
     },
60 69
     current_day_container: {
@@ -76,5 +85,10 @@ const day_list_styles = StyleSheet.create({
76 85
     day_list_day: {
77 86
         fontWeight: '900',
78 87
         margin: 4,
88
+    },
89
+    background: {
90
+        position: 'absolute',
91
+        width: '100%',
92
+        height: "100%",
79 93
     }
80 94
 });

Завантаження…
Відмінити
Зберегти