물결 효과 추가하기

안드로이드

기존에는 물결 효과가 컨테이너 전체가 아닌 텍스트 위에만 나타난다.

해결 방법

padding을 goalText에 넣어주면 안쪽 여백이 텍스트 일부가 되어 물결 효과가 안쪽 여백에 적용된다.

const styles = StyleSheet.create({
  goalItem: {
    margin: 8,
    borderRadius: 6,
    backgroundColor: "#5e0acc",
  },
  goalText: {
    color: "white",
    padding: 8,
  },
});

아이폰

터치 상태가 변할 때마다 pressable이 자동으로 호출된다. 현재 터치 상태와 관련된 정보를 포함한 상수를 매개변수로 사용한다. 객체 구조 분해를 사용해서 우리가 구할 객체의 일부인 pressed 프로퍼티를 확보한다.이로써 우리는 다양한 스타일 객체를 반환할 수 있다.

<Pressable
  android_ripple={{ color: "#210644" }}
  onPress={props.onDeleteItem.bind(this, props.id)}
  style = {({pressed}) => pressed && styles.pressedItem}
  >