Skip to content

Commit 1fa0961

Browse files
committed
docs: Adeed screenshots for Drawer's options
1 parent bb6c938 commit 1fa0961

File tree

6 files changed

+38
-1
lines changed

6 files changed

+38
-1
lines changed
Loading
Loading
67.5 KB
Loading
34.4 KB
Loading
83.6 KB
Loading

versioned_docs/version-7.x/drawer-navigator.md

Lines changed: 38 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -332,10 +332,22 @@ Function, that given `{ focused: boolean, color: string, size: number }` returns
332332

333333
Color for the icon and label in the active item in the drawer.
334334

335+
<img src="/assets/7.x/drawer/drawerActiveTintColor.png" width="500" alt="Drawer active tint color" />
336+
337+
```js
338+
drawerActiveTintColor: 'green',
339+
```
340+
335341
#### `drawerActiveBackgroundColor`
336342

337343
Background color for the active item in the drawer.
338344

345+
<img src="/assets/7.x/drawer/drawerActiveBackgroundColor.png" width="500" alt="Drawer active background color" />
346+
347+
```js
348+
drawerActiveBackgroundColor: '#939B6C',
349+
```
350+
339351
#### `drawerInactiveTintColor`
340352

341353
Color for the icon and label in the inactive items in the drawer.
@@ -348,10 +360,35 @@ Background color for the inactive items in the drawer.
348360

349361
Style object for the single item, which can contain an icon and/or a label.
350362

363+
<img src="/assets/7.x/drawer/drawerItemStyle.png" width="500" alt="Drawer item style" />
364+
365+
Example:
366+
367+
```js
368+
drawerItemStyle: {
369+
backgroundColor: '#9dd3c8',
370+
borderColor: 'black',
371+
orderWidth: 2,
372+
opacity: 0.6,
373+
},
374+
```
375+
351376
#### `drawerLabelStyle`
352377

353378
Style object to apply to the `Text` style inside content section which renders a label.
354379

380+
<img src="/assets/7.x/drawer/drawerLabelStyle.png" width="500" alt="Drawer label style" />
381+
382+
Example:
383+
384+
```js
385+
drawerLabelStyle: {
386+
color: 'black',
387+
fontSize: 20,
388+
fontFamily: 'Georgia',
389+
},
390+
```
391+
355392
#### `drawerContentContainerStyle`
356393

357394
Style object for the content section inside the `ScrollView`.
@@ -364,7 +401,7 @@ Style object for the wrapper view.
364401

365402
Style object for the drawer component. You can pass a custom background color for a drawer or a custom width here.
366403

367-
<samp id="drawer-with-style" />
404+
<img src="/assets/7.x/drawer/drawerStyle.png" width="500" alt="Drawer style" />
368405

369406
```js
370407
<Drawer.Navigator

0 commit comments

Comments
 (0)