Skip to content

Commit

Permalink
Enabling the photo-taking functionality.
Browse files Browse the repository at this point in the history
  • Loading branch information
@EdwardHaoranLee
EdwardHaoranLee committed Nov 8, 2020
1 parent f5abd00 commit d76c3eb
Show file tree
Hide file tree
Showing 3 changed files with 143 additions and 243 deletions.
221 changes: 124 additions & 97 deletions Flourish/App.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -197,111 +197,138 @@ const SettingsTabScreenGenerator = () => {
);
}

const PhotoTabScreenGenerator = () => {
const PhotoTabScreenGenerator = (tab) => {
return (
<PhotoTabScreen />
<PhotoTabScreen tab={tab}/>
);
}

const Tab = createBottomTabNavigator();

function MyTabs() {
return (
<Tab.Navigator tabBarOptions={{
activeTintColor: ActiveTintColor,
inactiveTintColor: InactiveTintColor
}}>
<Tab.Screen
name="Flourishing"
component={FlourishingTabScreenGenerator}
options={{
tabBarLabel: "Flourishing",
tabBarIcon: ({ color, size }) => (
<MaterialCommunityIcons name="water" color={color} size={size} />
),
// tabBarBadge: 0,
}}
/>
<Tab.Screen
name="Garden"
component={GardenTabScreenGenerator}
options={{
class MyTabs extends React.Component{

tabBarLabel: "Garden",
tabBarIcon: ({ color, size }) => (
<MaterialCommunityIcons name="flower" color={color} size={size} />
),
}}
/>
<Tab.Screen
name="Photo"
component={PhotoTabScreenGenerator}
// style={}
options={{
tabBarLabel: "Photo",
tabBarIcon: () => (
<View style={{
position: 'absolute',
bottom: 0, // space from bottombar
height: 70,
width: 70,
borderRadius: 58,
backgroundColor: '#ffffff',
justifyContent: 'center',
alignItems: 'center',
// shadowColor: "#00000050",
// shadowOffset: {
// width: 0,
// height: 0,
// },
// shadowOpacity: 0.3,
// shadowRadius: 3.84,
// elevation: 3,
borderWidth: 3,
borderColor: '#ef5e85',
}}>
<Image
source={require("./assets/camera.png")}
style={{
// width: 40,
// height: 40,
alignContent: 'center',
justifyContent: 'center',
// position: 'absolute',
// bottom: 10, // space from bottombar
height: 50,
width: 50,
borderRadius: 58,
alignItems: 'center',
takePhotoButton = React.createRef()

state = {
tab: "Flourishing"
}

handleTabChange = (tabName) => {
this.setState({
tab: tabName
})
}

takePhoto = (tabName) => {
this.handleTabChange(tabName)

}

render(){
return (
<Tab.Navigator tabBarOptions={{
activeTintColor: ActiveTintColor,
inactiveTintColor: InactiveTintColor
}}>
<Tab.Screen
onPress={() => this.handleTabChange("Flourishing")}
name="Flourishing"
component={FlourishingTabScreenGenerator}
options={{
tabBarLabel: "Flourishing",
tabBarIcon: ({ color, size }) => (
<MaterialCommunityIcons name="water" color={color} size={size} />
),
// tabBarBadge: 0,
}}
/>
<Tab.Screen
onPress={() => this.handleTabChange("Garden")}
name="Garden"
component={GardenTabScreenGenerator}
options={{

tabBarLabel: "Garden",
tabBarIcon: ({ color, size }) => (
<MaterialCommunityIcons name="flower" color={color} size={size} />
),
}}
/>
<Tab.Screen
onPress={() => this.handleTabChange("Photo")}
name="Photo"
component={() => PhotoTabScreenGenerator(this.state.tab)}

// style={}
options={{
tabBarLabel: "Photo",
tabBarIcon: () => (
<View style={{
position: 'absolute',
bottom: 0, // space from bottombar
height: 70,
width: 70,
borderRadius: 58,
backgroundColor: '#ffffff',
justifyContent: 'center',
alignItems: 'center',
// shadowColor: "#00000050",
// shadowOffset: {
// width: 0,
// height: 0,
// },
// shadowOpacity: 0.3,
// shadowRadius: 3.84,
// elevation: 3,
borderWidth: 3,
borderColor: '#ef5e85',
}}>
<Image
source={require("./assets/camera.png")}
style={{
// width: 40,
// height: 40,
alignContent: 'center',
justifyContent: 'center',
// position: 'absolute',
// bottom: 10, // space from bottombar
height: 50,
width: 50,
borderRadius: 58,
alignItems: 'center',

}}
/>
</View>
),
}}
/>
<Tab.Screen
onPress={() => handleTabChange("Plantpedia")}
name="Plantpedia"
component={PlantpediaTabScreenGenerator}
options={{
tabBarLabel: "Plantpedia",
tabBarIcon: ({ color, size }) => (
<MaterialCommunityIcons name="magnify" color={color} size={size} />
),
}}
/>
<Tab.Screen
onPress={() => handleTabChange("Settings")}
name="Settings"
component={SettingsTabScreenGenerator}
options={{
tabBarLabel: "Settings",
tabBarIcon: ({ color, size }) => (
<MaterialCommunityIcons name="tune" color={color} size={size} />
),
}}
/>
</Tab.Navigator>
);
}

}}
/>
</View>
),
}}
/>
<Tab.Screen
name="Plantpedia"
component={PlantpediaTabScreenGenerator}
options={{
tabBarLabel: "Plantpedia",
tabBarIcon: ({ color, size }) => (
<MaterialCommunityIcons name="magnify" color={color} size={size} />
),
}}
/>
<Tab.Screen
name="Settings"
component={SettingsTabScreenGenerator}
options={{
tabBarLabel: "Settings",
tabBarIcon: ({ color, size }) => (
<MaterialCommunityIcons name="tune" color={color} size={size} />
),
}}
/>
</Tab.Navigator>
);
}

export default function App() {
Expand Down
10 changes: 5 additions & 5 deletions Flourish/Tabs/FlourishingTabScreen.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@ export default class FlourishingTabScreen extends React.Component {
plants: this.props.plants,

})
console.log(this.state.plants)
this.getAllReminders();
}

Expand All @@ -20,16 +21,15 @@ export default class FlourishingTabScreen extends React.Component {
}

getAllReminders = () => {
let plants = this.state.plants;
let plants = this.props.plants;
let todayReminders = [];
let weekReminders = [];
let dayMili = 24 * 60 * 60 * 1000
let today = new Date(Date.now());
let week = new Date(today.getTime() + 7 * dayMili);

for (let i = 0; i < plants.length; i++) {
for (let j = 0; j < plants[i].reminders.length; j++) {
let r = plants[i].reminders[j];
for (let j = 0; j < plants[i].reminder.length; j++) {
let r = plants[i].reminder[j];
if (r.date.getTime() < today.getTime() + 1 * dayMili && r.date.getTime() > today.getTime() - dayMili) {
todayReminders.push(r);
} else if (r.date.getTime() < week.getTime()) {
Expand Down Expand Up @@ -63,7 +63,7 @@ export default class FlourishingTabScreen extends React.Component {
<SafeAreaView style={styles.container}>
<SectionList
style={styles.sectionContainer}
sections={DATA}
sections={this.state.reminders}
keyExtractor={(item, index) => item + index}
renderItem={item => this.renderItem(item)}
renderSectionHeader={({ section: { title } }) => (
Expand Down
Loading

0 comments on commit d76c3eb

Please sign in to comment.