МІНІСТЕРСТВО ОСВІТИ І НАУКИ УКРАЇНИ

НАЦІОНАЛЬНИЙ ТЕХНІЧНИЙ УНІВЕРСИТЕТ УКРАЇНИ

“КИЇВСЬКИЙ ПОЛІТЕХНІЧНИЙ ІНСТИТУТ
імені ІГОРЯ СІКОРСЬКОГО”
Факультет прикладної математики
Кафедра програмного забезпечення комп’ютерних систем

Лабораторна робота №1

з дисципліни: «Програмне забезпечення систем автоматичної

ідентифікації»

Виконала:
студентка V курсу каф.
ПЗКС ФПМ
групи КП-31мп

Музичук Марина
Анатоліївна

Перевірила:

доц. каф. ПЗКС ФПМ

Боярінова Ю.Є.

Київ 2023
 Індивідуальне завдання

Завдання для виконання: Розробити програмне забезпечення для

створення штрихового коду за варіантом.

Варіант: № 10. Штриховий код EAN-8.

Лістинг коду програми

import React, { useState } from 'react';

import {
SafeAreaView,
StyleSheet,
Text,
useColorScheme,
TextInput,
View,
} from 'react-native';
import Barcode from './src/components/Barcode';
import { getLastNumberOfGoodsId } from
'./src/utils/getLastNumberOfGoodsId';

function App() {

const [string, setString] = useState('1234567')

const [inputString, setInputString] = useState('')

const handleInputChange = (value) => {

if(value <= 9999999){
if(value > 999999){
setString(`${value}`)
}
setInputString(value)
}

const lastNumber = getLastNumberOfGoodsId(string.split('').map(el =>

parseInt(el)))

return (
<SafeAreaView style={styles.wrapper}>
<Barcode numberValue={string + lastNumber} />
<View style={styles.inputWrapper}>
<Text>
Input numbers
</Text>
<TextInput
style={styles.input}
onChangeText={handleInputChange}
value={inputString}
placeholder="input here"
keyboardType="numeric"
 maxLength={7}
/>
</View>
</SafeAreaView>
);
}

const styles = StyleSheet.create({

wrapper: {
width: '100%',
height: '100%',
backgroundColor: '#dedede',
justifyContent: 'center',
alignItems: 'center'
},
inputWrapper: {
marginTop: 20,
flexDirection: 'row',
alignItems: 'center'
},
input: {
height: 40,
margin: 12,
borderWidth: 1,
padding: 10,
},
});

export default App;

import React from 'react'

import BarItemList from '../BarItemList'
import { View, StyleSheet } from 'react-native'

const Barcode = ({ numberValue = '1234567' }) => {

const numbers = numberValue.split('');

const left = numbers.slice(0, 4)
const right = numbers.slice(4)

const splitedCharsLeft = ['start', ...left, 'devider']

const splitedCharsRight = [...right, 'end']

return (
<View style={styles.wrapper}>
<BarItemList splitedCharsLeft={splitedCharsLeft}
splitedCharsRight={splitedCharsRight}/>
</View>
)
}

const styles = StyleSheet.create({

wrapper: {
paddingHorizontal: 20,
height: 140,
backgroundColor: '#fff',
borderRadius: 15,
justifyContent: 'center',
alignItems: 'center',
}
 });

export default Barcode

import React from 'react'

import BarItem from '../BarItem/BarItem'
import { View, StyleSheet } from 'react-native'

const BarItemList = ({ splitedCharsLeft, splitedCharsRight }) => {

return (
<View style={styles.wrapper}>
{
splitedCharsLeft.map(char => {
return (
<BarItem char={char} isLeft={true}/>
)
})
}
{
splitedCharsRight.map(char => {
return (
<BarItem char={char} isLeft={false}/>
)
})
}
</View>
)
}

const styles = StyleSheet.create({

wrapper: {
flexDirection: 'row',
height: 90,
}
});

export default BarItemList

import React from 'react'

import Stroke from '../Stroke'
import { convertCharToBarcode, convertCharToBarcode2 } from
'../../utils/charToBarcodeConverter'
import { View, Text, StyleSheet } from 'react-native'

const BarItem = ({ char, isLeft }) => {

const barcode = isLeft ? convertCharToBarcode(char) :

convertCharToBarcode2(char)

return (
<View style={[styles.wrapper, ['start', 'end'].includes(char) ?
{width: 12} : char === 'devider' ? {width: 20} : {width: 28}]}>
<View style={[styles.strokeListWrapper, ['start', 'end',
'devider'].includes(char) ? { height: '100%' } : { height: '76%' }]}>
{
barcode.map((barcodeItem, index) => {
return (
<Stroke value={barcodeItem}
color={barcodeItem ? '#000' : '#fff'}/>
)
 })
}
</View>
<Text style={styles.charWrapper}>
{['start', 'end', 'devider'].includes(char) ? '' : char}
</Text>
</View>
)
}

const styles = StyleSheet.create({

wrapper: {
width: 28,
height: '100%',
alignItems: 'center',
},
strokeListWrapper: {
width: '100%',
height: '76%',
flexDirection: 'row',
justifyContent: 'center'
},
charWrapper: {
fontWeight: '800',
}
});

export default BarItem

import React from 'react'

import { View, StyleSheet } from 'react-native'

const Stroke = ({ value, color }) => {

return (
<View style={[styles.null, {backgroundColor: color}]}/>
)
}

const styles = StyleSheet.create({

null: {
width: 4,
height: '100%',
backgroundColor: '#000',
},
});

export default Stroke

import { charToBarcodeTable, charToBarcodeTable2 } from "../const/const"

export const convertCharToBarcode = (char) => {

return charToBarcodeTable[char]
}

export const convertCharToBarcode2 = (char) => {

return charToBarcodeTable2[char]
}

function findNextMultipleOfTen(n) {
return Math.ceil(n / 10) * 10;
}
export const getLastNumberOfGoodsId = (parsedArrOfNumbers) => {
let r1 =0, r2 = 0
parsedArrOfNumbers.forEach((number, index) => {
if((index + 2) % 2 === 0){
r1 += number
}
else{
r2 += number
}
});
r1 = r1 * 3
const r = r1 + r2
const c = findNextMultipleOfTen(r) - r
return c
}

Приклади результатів
 Висновки

У результаті виконання лабораторної роботи розроблено програмне

забезпечення для створення штрихового коду EAN-8.