import React, { useState } from 'react'; import { View, Text, TouchableOpacity, StyleSheet, ScrollView, TextInput, Alert, } from 'react-native'; import * as Print from 'expo-print'; import * as Sharing from 'expo-sharing'; export default function GenerateCardsScreen() { const [numberOfCards, setNumberOfCards] = useState('30'); const [cardsPerPage, setCardsPerPage] = useState('8'); const [isGenerating, setIsGenerating] = useState(false); const generateCardHTML = (cardId) => { return ` `; }; const generatePDF = async () => { setIsGenerating(true); try { const cards = Array.from({ length: parseInt(numberOfCards) }, (_, i) => i + 1); const html = ` `; const { uri } = await Print.printToFileAsync({ html }); if (await Sharing.isAvailableAsync()) { await Sharing.shareAsync(uri, { mimeType: 'application/pdf', dialogTitle: 'Карточки для печати', }); } else { Alert.alert('Успех', `PDF сгенерирован: ${uri}`); } } catch (error) { Alert.alert('Ошибка', error.message); } finally { setIsGenerating(false); } }; return ( Генератор карточек Пример карточки: #1001 QR-код A B C D Настройки генерации Количество карточек Карточек на странице Советы по печати: • Используйте плотную бумагу (160-200 г/м²) • Распечатайте в цвете для лучшего сканирования • Вырежьте по контуру после печати • Ламинируйте для долговечности {isGenerating ? 'Генерация...' : '🖨️ Сгенерировать PDF для печати'} Как использовать: 1. Сгенерируйте и распечатайте карточки 2. Раздайте каждому ученику уникальную карточку 3. В приложении привяжите номер карточки к ученику 4. Ученики показывают карточки с выбранным ответом сверху 5. Сканируйте карточки камерой телефона ); } const styles = StyleSheet.create({ container: { flex: 1, backgroundColor: '#f5f5f5', padding: 20, }, header: { fontSize: 28, fontWeight: 'bold', marginBottom: 20, color: '#333', }, cardPreview: { backgroundColor: 'white', borderRadius: 15, padding: 20, marginBottom: 20, alignItems: 'center', }, previewTitle: { fontSize: 18, fontWeight: 'bold', marginBottom: 15, }, previewCard: { width: 200, height: 200, borderWidth: 3, borderColor: '#333', borderRadius: 10, alignItems: 'center', justifyContent: 'center', backgroundColor: 'white', }, previewId: { position: 'absolute', top: 8, left: 8, fontSize: 12, fontWeight: 'bold', color: '#666', }, previewQR: { width: 100, height: 100, backgroundColor: '#f0f0f0', justifyContent: 'center', alignItems: 'center', borderRadius: 5, }, previewOption: { position: 'absolute', fontSize: 18, fontWeight: 'bold', }, optionA: { left: 10, top: '50%', transform: [{ translateY: -10 }], }, optionB: { top: 10, left: '50%', transform: [{ translateX: -10 }], }, optionC: { right: 10, top: '50%', transform: [{ translateY: -10 }], }, optionD: { bottom: 10, left: '50%', transform: [{ translateX: -10 }], }, settings: { backgroundColor: 'white', borderRadius: 15, padding: 20, marginBottom: 20, }, settingsTitle: { fontSize: 18, fontWeight: 'bold', marginBottom: 15, }, inputGroup: { marginBottom: 20, }, label: { fontSize: 14, marginBottom: 8, color: '#666', }, input: { borderWidth: 1, borderColor: '#ddd', borderRadius: 8, padding: 12, fontSize: 16, backgroundColor: '#f9f9f9', }, tips: { backgroundColor: '#E8F5E9', padding: 15, borderRadius: 8, marginTop: 10, }, tipsTitle: { fontWeight: 'bold', marginBottom: 5, color: '#2E7D32', }, generateButton: { backgroundColor: '#2196F3', padding: 18, borderRadius: 10, alignItems: 'center', marginBottom: 20, }, disabledButton: { backgroundColor: '#90CAF9', }, generateButtonText: { color: 'white', fontSize: 16, fontWeight: 'bold', }, instructions: { backgroundColor: '#FFF3E0', padding: 20, borderRadius: 10, }, instructionsTitle: { fontSize: 16, fontWeight: 'bold', marginBottom: 10, color: '#EF6C00', }, });