List.Accordion border radius

[ardaOnal]

Ask your Question

Is it possible to have borderRadius on List.Accordion? Currently it has rigid corners and I want them to be rounded.

<View
  style={{
    position: "relative",
    zIndex: 100,
    borderRadius: 100,
    backgroundColor: "red",
  }}
>
  <List.Section style={{ borderRadius: 200 }}>
    <List.Accordion
      title={selectedPostCategory}
      left={(props) =>
        selectPostCategoryIcon(props, selectedPostCategory)
      }
      onPress={(e: GestureResponderEvent) =>
        handlePostDropdownPress(selectedPostCategory)
      }
      expanded={postDropdownExpanded}
      titleStyle={{ fontSize: 22 }}
      style={{ borderRadius: 100 }}
    >
      <View style={dashboardStyles.postCategoryDropdown}>
        {postCategories.map((item, index) =>
          item !== selectedPostCategory ? (
            <List.Item
              key={index}
              title={item}
              onPress={(e: GestureResponderEvent) =>
                handlePostDropdownPress(item)
              }
              titleStyle={{ fontSize: 16 }}
              left={(props) => selectPostCategoryIcon(props, item)}
              style={{ backgroundColor: "white" }}
            />
          ) : undefined
        )}
      </View>
    </List.Accordion>
  </List.Section>
</View>

[gedu]

Hey, at least for now I think you can't change it, because the View holding the content doesn't use any other style

ListAccordion.tsx

<View style={{ backgroundColor: theme?.colors?.background }}>

But what you can do is remove the white background color from it, doing:

<List.Accordion
              title={"woohoo"}
              theme={{colors: {background: 'transparent'}}}>