React native 我的按钮的一半不能只在Android上点击？

我有一个像图中一样的视图，我在中间有一个按钮（眼睛图标），当我在IOS上点击它时，它是完全可点击的，但在Android上只有按钮的一半（一半是底部）是可点击的，我当然希望它是完全可点击的

我正在使用样式化组件来设置视图和按钮等的样式

对于我的情况，is Mobile条件始终为

true

下面是我的组件返回的内容：

  return (
    <>
      <Wrapper isMobile={AppHelpers.isMobile()}>
        <FilterWrapper>
          <FilterText>{t('filter-by')}</FilterText>
          <FilterSelectWrapper>
            <Select
              value={selectedCategory}
              placeholder={filterText}
              placeHoldeOpacity={0.2}
              color={black}
              borderBottomColor={cornflowerBlue}
              render={renderSelectOptions(handleFiltersChange, categoriesList)}
              hasSelectContent
            />
          </FilterSelectWrapper>
        </FilterWrapper>
        <CircuitsListWrapper isMobile={isMobile} data={circuits} renderItem={singleCircuit} />
        {isFooterVisible && (
          <FooterBlock>
            <FooterSide onPress={handleEmptyMap}>
              <Command>{t('empty-map')}</Command>
            </FooterSide>
            <ViewCircuit onPress={handleViewCircuit}>
              <ViewCircuitIcon source={viewCircuitIcon} />
            </ViewCircuit>
            <FooterSide onPress={handleSelectAll}>
              <Command>{t('select-all')}</Command>
            </FooterSide>
          </FooterBlock>
        )}
      </Wrapper>
    </>
  );

这可能很长，但我认为这就是我们所需要的

任何帮助都将不胜感激。

请帮助：），任何帮助都将不胜感激

import styled from 'styled-components/native';

import { black, cornflowerBlue, darkShadow, white, blue } from '../../../../../../../packages/ui-colors';
import { fontSizeBase, fontSizeLarge } from '../../../../../../../packages/ui-fonts';
import { Dimensions } from 'react-native';

export const Wrapper = styled.View(
  {
    flex: 1,
    width: 400,
    height: Dimensions.get('window').height * 0.4,
  },
  ({ isMobile }) =>
    isMobile && {
      width: '100%',
    },
);

export const CircuitsListWrapper = styled.FlatList(
  {
    width: '100%',
    height: 200,
  },
  ({ isMobile }) =>
    isMobile && {
      flex: 1,
      height: 300,
    },
);

export const FooterBlock = styled.View({
  backgroundColor: white,
  height: 48,
  flexDirection: 'row',
  justifyContent: 'space-between',

  shadowColor: black,
  shadowOffset: {
    width: 0,
    height: -13,
  },
  shadowOpacity: 0.3,
  shadowRadius: 4,
});

export const ViewCircuit = styled.TouchableOpacity({
  backgroundColor: cornflowerBlue,
  width: 64,
  height: 64,
  marginBottom: 16,
  alignSelf: 'flex-end',
  elevation: 10,
  shadowColor: black,
  shadowOffset: {
    width: 0,
    height: 3,
  },
  shadowOpacity: 0.5,
  shadowRadius: 4,
  borderRadius: 48,
  padding: 16,
  justifyContent: 'center',
});

export const FooterSide = styled.TouchableOpacity({
  maxWidth: 145,
  flexGrow: 1,
  height: 48,
  justifyContent: 'center',
});

export const Command = styled.Text({
  color: cornflowerBlue,
  fontWeight: 'bold',
  textAlign: 'center',
});