Add some usage tips to tips page

master
Tanner Collin 7 years ago
parent a35a693451
commit 932dea9746
  1. 1
      src/actions/actionTypes.js
  2. 6
      src/actions/menuActions.js
  3. 4
      src/components/menu.js
  4. 37
      src/components/tips.js
  5. 3
      src/containers/nav.js
  6. 16
      src/containers/tipsApp.js
  7. 7
      src/reducers/menu.js

@ -7,4 +7,5 @@ export const MAIN = 'MAIN';
export const CHART = 'CHART';
export const HELP = 'HELP';
export const EXAMPLE = 'EXAMPLE';
export const TIPS = 'TIPS';
export const ABOUT = 'ABOUT';

@ -36,6 +36,12 @@ export function example() {
};
}
export function tips() {
return {
type: types.TIPS
};
}
export function about() {
return {
type: types.ABOUT

@ -22,7 +22,7 @@ export default class Menu extends Component {
}
render() {
const {about, main, chart, help, example} = this.props;
const {about, main, chart, help, tips, example} = this.props;
return (
<View style={styles.main}>
@ -32,7 +32,7 @@ export default class Menu extends Component {
<MyText style={styles.menutable} onPress={chart}>Color Chart</MyText>
<MyText style={styles.menutable} onPress={help}>Help</MyText>
<MyText style={styles.menutable} onPress={example}>Example</MyText>
<MyText style={styles.menutable} onPress={null}>Tips</MyText>
<MyText style={styles.menutable} onPress={tips}>Tips</MyText>
<MyText style={[styles.menutable, {borderBottomWidth: 0}]} onPress={about}>About</MyText>
</ScrollView>
<Image style={{alignSelf: 'flex-end', height: 20, width: 116}} source={require('../images/menulogobottom.png')} resizeMode={'contain'} />

@ -0,0 +1,37 @@
import React, {Component} from 'react';
import {ScrollView, View} from 'react-native';
import MyText from './mytext.js';
import Section from './section.js';
export default class Tips extends Component {
constructor(props) {
super(props);
}
render() {
return (
<ScrollView>
<View style={{padding: 20}}>
<Section>
<MyText style={{fontWeight: 'bold'}}>Don't hold both resistor leads while measuring</MyText>
<MyText>The resistance of your body added in parallel is enough to effect the measurement of higher valued resistors. Since the purpose of this app is to help you create a precise resistance value, doing so is counterproductive.</MyText>
</Section>
<Section>
<MyText style={{fontWeight: 'bold'}}>Don't press the resistor leads against an ESD mat</MyText>
<MyText>Most ESD mats are slightly conductive to allow static charges to dissipate. This also has the problem of affecting the resistance measurement of higher valued resistors.</MyText>
</Section>
<Section>
<MyText style={{fontWeight: 'bold'}}>Use only one hand to hold the resistor</MyText>
<MyText>When measuring the resistors, use only one hand to hold the resistor to a multimeter lead. Grip the other multimeter lead by only the plastic part with your other hand. Then use the tension in the resistor's remaining lead to bring the two together and form a circuit.</MyText>
</Section>
<Section>
<MyText style={{fontWeight: 'bold'}}>Increase precision by adding significant figures</MyText>
<MyText>You can increase the precision of the calculations shown by the app by adding more significant figures to your target resistance. This way you can make your solution as precise as you need.</MyText>
</Section>
</View>
</ScrollView>
);
}
}

@ -12,6 +12,7 @@ import ChartApp from '../containers/chartApp';
import CalcApp from '../containers/calcApp';
import HelpApp from '../containers/helpApp';
import ExampleApp from '../containers/exampleApp';
import TipsApp from '../containers/tipsApp';
import AboutApp from '../containers/aboutApp';
class Nav extends Component {
@ -67,6 +68,8 @@ class Nav extends Component {
return <HelpApp />;
case 'example':
return <ExampleApp />;
case 'tips':
return <TipsApp />;
case 'about':
return <AboutApp />;
default:

@ -0,0 +1,16 @@
'use strict';
import React, {Component} from 'react';
import Tips from '../components/tips';
export default class TipsApp extends Component {
constructor(props) {
super(props);
}
render() {
return (
<Tips />
);
}
}

@ -48,6 +48,13 @@ export default function menu(state = initialState, action = {}) {
page: 'example',
subtitle: 'Example Usage',
};
case types.TIPS:
return {
...state,
isOpen: false,
page: 'tips',
subtitle: 'Tips',
};
case types.ABOUT:
return {
...state,

Loading…
Cancel
Save