Skip to content

Commit

Permalink
sdp-tech#77 feat: add lookbook base layout
Browse files Browse the repository at this point in the history
  • Loading branch information
eujin-shin committed Jul 10, 2024
1 parent ac85b71 commit 6b5e3e0
Show file tree
Hide file tree
Showing 4 changed files with 35 additions and 4 deletions.
1 change: 0 additions & 1 deletion src/common/Toggle.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,6 @@ const Toggle = ({
};

useEffect(() => {
console.log('animation on');
Animated.timing(animationXTrans, {
toValue: isOn ? X_COORD_ON : X_COORD_OFF,
duration: ANIMATION_DURATION,
Expand Down
16 changes: 16 additions & 0 deletions src/components/Lookbook/ListItem.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
import { Dimensions, View } from 'react-native';

const ListItem = () => {
const { width } = Dimensions.get('screen');

const COLUMN_COUNT = 2;
const ITEM_WIDTH = (width * 0.9) / COLUMN_COUNT;

return (
<View style={{ width: ITEM_WIDTH }}>
<View style={{ width: '100%', backgroundColor: 'gray', height: 200 }} />
</View>
);
};

export default ListItem;
11 changes: 11 additions & 0 deletions src/components/Lookbook/LookbookList.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
import { Dimensions, View } from 'react-native';

const LookbookList = () => {
const { width } = Dimensions.get('window');
return (
<View
style={{ width: '100%', backgroundColor: 'gray', height: 300 }}></View>
);
};

export default LookbookList;
11 changes: 8 additions & 3 deletions src/pages/ComponentsTest.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,8 @@ import LookbookButton from '../components/Lookbook/LookbookButton';
import LookbookAddButton from '../components/Lookbook/LookbookAddButton';
import TextToggle from '../common/TextToggle';
import Toggle from '../common/Toggle';
import ListItem from '../components/Lookbook/ListItem';
import LookbookList from '../components/Lookbook/LookbookList';

const TestDropdown = ({ index }: { index: number }) => {
const [value, setValue] = useState<string | undefined>(undefined);
Expand Down Expand Up @@ -33,9 +35,12 @@ export default function ComponentsTest() {
<SafeAreaView style={{ flex: 1 }}>
<View style={{ flex: 1, padding: 20 }}>
<Title20B>룩북 컴포넌트</Title20B>
<LookbookButton />
<LookbookAddButton onPress={() => {}} />
<TestToggle />
<View style={{ marginVertical: 20 }}>
<LookbookButton />
<LookbookAddButton onPress={() => {}} />
<TestToggle />
<LookbookList />
</View>
</View>
</SafeAreaView>
);
Expand Down

0 comments on commit 6b5e3e0

Please sign in to comment.