You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

110 lines
2.8 KiB

import React from 'react';
import {View, Text, ScrollView, Image, Dimensions} from 'react-native';
import tw from 'tailwind-react-native-classnames';
import olum2Image from '../assets/olum2.png';
import olum1Image from '../assets/olum1.png';
import zist11Image from '../assets/zist11.png';
const width = Dimensions.get('window').width;
const height = Dimensions.get('window').height;
export default function MyBooks({myBooks}) {
return (
<View
style={[
tw.style(
'flex flex-col shadow-sm rounded-md py-4 px-2 border items-start',
),
{
backgroundColor: '#E9F0FF',
borderColor: '#D2E0FD',
direction: 'rtl',
},
]}>
<Text
style={[
tw.style('text-blue-500 mb-4 font-semibold'),
{fontSize: width / 18, color : '#196EC0'},
]}>
کتاب من
</Text>
<ScrollView
horizontal={true}
style={[tw.style('')]}
showsHorizontalScrollIndicator={false}>
{myBooks.map((book, index) => (
<View style={[tw.style('flex flex-col mr-4 items-start')]} key={index}>
<Image
style={
[{width: width / 3, height: height / 4}, tw.style('rounded-md')]
}
source={book.imageUrl}
/>
<Text
style={[
{marginVertical: 10, color: '#05335F', fontSize: width / 27},
tw.style('font-semibold'),
]}>
{book.name}
</Text>
<Text style={{color: '#196EC0', fontSize: width / 30}}>
{book.grade}
</Text>
<View
style={[
tw.style('rounded-md mt-4'),
{height: 6, width: '100%', backgroundColor: '#D3E9FF'},
]}>
<View
style={[
tw.style('h-full rounded-md'),
{width: book.progress + '%', backgroundColor : "#2B8DEB"},
]}></View>
</View>
</View>
))}
</ScrollView>
</View>
);
}
MyBooks.defaultProps = {
myBooks: [
{
name: 'علوم تجربی',
imageUrl: zist11Image,
grade: 3,
progress: 70,
},
{
name: 'زیست شناسی',
imageUrl: zist11Image,
grade: 4,
progress: 60,
},
{
name: 'علوم اجتماعی',
imageUrl: zist11Image,
grade: 12,
progress: 90,
},
{
name: 'علوم تجربی',
imageUrl: zist11Image,
grade: 3,
progress: 70,
},
{
name: 'زیست شناسی',
imageUrl: zist11Image,
grade: 4,
progress: 60,
},
{
name: 'علوم اجتماعی',
imageUrl: zist11Image,
grade: 12,
progress: 90,
},
],
};