Dynami c высота для реакции нативного rn_bottom_drawer - PullRequest
Новая
       40

Dynami c высота для реакции нативного rn_bottom_drawer

0 голосов
/ 05 февраля 2020

Я использую rn-нижний ящик для реализации ящика для моего приложения. Я пробовал несколько способов, таких как PixelRatio, ModerateScale, If-else для диапазона высоты экрана, но мне не удалось установить такой параметр containerHeight, чтобы он идеально работал на всех экранах устройства, и между моим ящиком и нижней частью экрана не было места.

Мой код: 

<BottomDrawer
            ref={"_drawer"}
            containerHeight={moderateScale(270)}
            startUp={false}
            backgroundColor={null}
            downDisplay={moderateScale(200)}
            onExpanded={() => this.setState({ isRecentSearchesExpanded: true })}
            onCollapsed={() => this.setState({ isRecentSearchesExpanded: false })}
        >
            <View style={{
                width: screenWidth,
            }}>
                <ImageBackground source={require('../../assets/tabBkgd.png')} style={{ height: "100%", width: screenWidth, justifyContent: "center", backgroundColor: "transparent" }} resizeMode="stretch">
                    {/* some views here */}
                </ImageBackground>
            </View>
        </BottomDrawer>

1 Ответ

0 голосов
/ 05 февраля 2020

Это пакет, который я использую для динамических c высоты и ширины:

rn-отзывчивый .

В основном вам нужно зарегистрироваться телефон какой высоты подходит. Предположим, вы получили 80, а ваш deviceHeight равен 640, тогда все, что вам нужно сделать, это вычислить (80/640)*100 i.e 12.5, поэтому теперь

Просто выполните: 

import {widthPercentageToDP as wp, heightPercentageToDP as hp} from 'react-native-responsive-screen';
<BottomDrawer
            ref={"_drawer"}
            containerHeight={hp("12.5%")}

и его исправили. Надеюсь, поможет. не стесняйтесь сомнений

...