Add screenshot of increasing precision to tips page

This commit is contained in:
2017-02-07 00:46:19 -07:00
förälder ab9af756a4
incheckning 04bd63b273
5 ändrade filer med 4613 tillägg och 62 borttagningar

4530
imagesrc/tips4.svg Normal file

Filskillnaden har hållits tillbaka eftersom den är för stor Load Diff

Efter

Bredd:  |  Höjd:  |  Storlek: 334 KiB

Visa fil

@@ -1,5 +1,5 @@
import React, {Component} from 'react';
import {Dimensions, Image, ScrollView, StyleSheet, View, TouchableOpacity} from 'react-native';
import {ScrollView, StyleSheet, View, TouchableOpacity} from 'react-native';
import MyText from './mytext.js';
import MyImage from './myimage.js';
@@ -55,40 +55,42 @@ export default class Example extends Component {
const {viewInfo} = this.state;
return (
<ScrollView>
<View onLayout={(event) => this.setState({
viewInfo: event.nativeEvent,
})} style={{padding: 20}}>
<Section>
<MyText>Suppose our design calls for an 863 resistance. First, we enter 863 into the top field:</MyText>
<MyImage view={viewInfo} data={images.img1} />
</Section>
<Section>
<MyText>The calulator will recommend 863 , but we don't have anything close to that in our bin of scrap resistors. We find a 1 kΩ resistor and measure it to be 992 . We enter this into the calculator:</MyText>
<MyImage view={viewInfo} data={images.img2} />
</Section>
<Section>
<MyText>You will see the calculator now recommends we add a 6.64 kΩ resistor, and is telling us we are 14.9% away from our 863 target:</MyText>
<MyImage view={viewInfo} data={images.img3} />
</Section>
<Section>
<MyText>The closest we can find is 6.8 kΩ, which we measure to be 6740 . We now enter this value too:</MyText>
<MyImage view={viewInfo} data={images.img4} />
</Section>
<Section>
<MyText>Now it recommends 432 kΩ, and we are 0.2% away from the target (pretty good for two resistors):</MyText>
<MyImage view={viewInfo} data={images.img5} />
</Section>
<Section>
<MyText>If we wanted to get even closer, we can keep going. We find a 470 kΩ resistor that reads 489.3 kΩ and enter it:</MyText>
<MyImage view={viewInfo} data={images.img6} />
</Section>
<Section>
<MyText>The calculator is now telling us we are right on our target with 0.00% error:</MyText>
<MyImage view={viewInfo} data={images.img7} />
</Section>
</View>
</ScrollView>
<View onLayout={(event) => this.setState({
viewInfo: event.nativeEvent,
})}>
<ScrollView>
<View style={{padding: 20}}>
<Section>
<MyText>Suppose our design calls for an 863 resistance. First, we enter 863 into the top field:</MyText>
<MyImage view={viewInfo} data={images.img1} />
</Section>
<Section>
<MyText>The calulator will recommend 863 , but we don't have anything close to that in our bin of scrap resistors. We find a 1 kΩ resistor and measure it to be 992 . We enter this into the calculator:</MyText>
<MyImage view={viewInfo} data={images.img2} />
</Section>
<Section>
<MyText>You will see the calculator now recommends we add a 6.64 kΩ resistor, and is telling us we are 14.9% away from our 863 target:</MyText>
<MyImage view={viewInfo} data={images.img3} />
</Section>
<Section>
<MyText>The closest we can find is 6.8 kΩ, which we measure to be 6740 . We now enter this value too:</MyText>
<MyImage view={viewInfo} data={images.img4} />
</Section>
<Section>
<MyText>Now it recommends 432 kΩ, and we are 0.2% away from the target (pretty good for two resistors):</MyText>
<MyImage view={viewInfo} data={images.img5} />
</Section>
<Section>
<MyText>If we wanted to get even closer, we can keep going. We find a 470 kΩ resistor that reads 489.3 kΩ and enter it:</MyText>
<MyImage view={viewInfo} data={images.img6} />
</Section>
<Section>
<MyText>The calculator is now telling us we are right on our target with 0.00% error:</MyText>
<MyImage view={viewInfo} data={images.img7} />
</Section>
</View>
</ScrollView>
</View>
);
}
}

Visa fil

@@ -1,5 +1,5 @@
import React, {Component} from 'react';
import {Dimensions, Image, Text, View} from 'react-native';
import {Image, Text, View} from 'react-native';
export default class MyImage extends Component {
constructor(props) {
@@ -10,17 +10,20 @@ export default class MyImage extends Component {
const {view, data} = this.props;
if (view.layout) {
const maxHeight = view.layout.height * 0.8;
const maxHeight = view.layout.height * 0.4;
const maxWidth = view.layout.width * 0.9;
// What the width will be if the responsive limit kicks in
const widthResp = view.layout.width * 0.6;
const aspectRatio = data.width / data.height;
let setWidth = maxWidth;
let setHeight = maxWidth / aspectRatio;
if (setHeight > maxHeight) {
setHeight = maxHeight;
setWidth = setHeight * aspectRatio;
setWidth = widthResp;
setHeight = setWidth / aspectRatio;
}
return (
@@ -44,6 +47,3 @@ export default class MyImage extends Component {
}
}
}

Visa fil

@@ -2,35 +2,54 @@ import React, {Component} from 'react';
import {ScrollView, View} from 'react-native';
import MyText from './mytext.js';
import MyImage from './myimage.js';
import Section from './section.js';
const images = {
img4: {
source: require('../images/tips4.png'),
width: 1857,
height: 1016,
},
};
export default class Tips extends Component {
constructor(props) {
super(props);
this.state = {
viewInfo: {},
};
}
render() {
const {viewInfo} = this.state;
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>
<View onLayout={(event) => this.setState({
viewInfo: event.nativeEvent,
})}>
<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>
<MyImage view={viewInfo} data={images.img4} />
</Section>
</View>
</ScrollView>
</View>
);
}
}

Binär
src/images/tips4.png Normal file

Binary file not shown.

Efter

Bredd:  |  Höjd:  |  Storlek: 241 KiB