I need to position the vertical scroll indicator to the left while it's always positioned to the right. I also need to edit the style of the scroll to look like the image below but nothing seems to be working. image of needed scroll

const renderItem = (item) => {
    return (
      <View style={styles.item}>
        <Text style={styles.textItem}>{item[props.valueName]}</Text>
      </View>
    );
  };

<Dropdown
        style={styles.dropdown}
        placeholderStyle={styles.placeholderStyle}
        selectedTextStyle={styles.selectedTextStyle}
        inputSearchStyle={styles.inputSearchStyle}
        search
        maxHeight={300}
        data={props.modalList}
        labelField={props.valueName}
        valueField={props.valueId}
        placeholder={props.listTitle}
        value={props.listValue}
        onChange={(item) => {
          selectValue(item);
        }}
        renderItem={renderItem}
        renderRightIcon={() => (
          <View style={[styles.iconContainer]}>
            <Image
              source={require("../assets/downArrow.png")}
            />
          </View>
        )}
      />