버튼 컴포넌트나 텍스트 필드(ex. 아이디 입력창) 컴포넌트 안에 있는 텍스트에게 프로퍼티를 적용해야할 때가 있다. 버튼에 올렸을때 글자의 색이 변한다든가, 글자 내용을 바꾼다던지, 사용자가 비밀번호 입력시 원래 있던 예시 번호를 안보이게 지워야 한다던지의 경우다.
참고로, 폰트, 색상, 아이콘은 파운데이션 요소라 이 세가지가 변하는 경우 프로퍼티가 아닌 베리언츠로 변경사항을 구분해줘야한다.
파운데이션? 각 회사의 제품, 회사 브랜드 디자인 그 자체의 디자인 시스템을 구성하는 가장 작은 요소.
회사의 대표 색상, 폰트, 아이콘, 레이아웃(디자인 구조)이 있다. 이것들은 아마 uxui 디자이너가 건드리기 보단, 전문적인 브랜드 디자이너들이 제안하고, 작업을 할 것이다.
아무튼, 이미 결정된 파운데이션을 적재적소에 사용하는게 uxui의 패턴일텐데, 파운데이션이 다양하게 사용된다면 베리언츠를 사용하여 각 경우를 구분하라는 뜻이다. 프로퍼티 기능은 이외의 파운데이션 이외의 변경 사항의 경우, 여러개 인스턴스를 만들지 말고 프로퍼티로 간소하게 제작해도 된다는 뜻이다.
아래 텍스트 프로퍼티는 해당 내용 '라벨'을 숨기거나 표시하기 위해 boolean property 를 사용할 것이다.
1. 부울린 프로퍼티(boolean property)
또한, 텍스트 필드 제목(라벨)에 써질 내용을 하나만 편집해서 여러개에 적용하기 위해 텍스트 프로퍼티를 적용한다. 아래의 버튼을 누르면 된다.
2. 텍스트 프로퍼티(Text property)
버튼 컴포넌트나 텍스트 필드(ex. 아이디 입력창) 컴포넌트 안에 있는 텍스트에게 프로퍼티를 적용해야할 때가 있다. 버튼에 올렸을때 글자의 색이 변한다든가, 글자 내용을 바꾼다던지, 사용자가 비밀번호 입력시 원래 있던 예시 번호를 안보이게 지워야 한다던지의 경우다.
참고로, 폰트, 색상, 아이콘은 파운데이션 요소라 이 세가지가 변하는 경우 프로퍼티가 아닌 베리언츠로 변경사항을 구분해줘야한다.
파운데이션? 각 회사의 제품, 회사 브랜드 디자인 그 자체의 디자인 시스템을 구성하는 가장 작은 요소.
회사의 대표 색상, 폰트, 아이콘, 레이아웃(디자인 구조)이 있다. 이것들은 아마 uxui 디자이너가 건드리기 보단, 전문적인 브랜드 디자이너들이 제안하고, 작업을 할 것이다.
아무튼, 이미 결정된 파운데이션을 적재적소에 사용하는게 uxui의 패턴일텐데, 파운데이션이 다양하게 사용된다면 베리언츠를 사용하여 각 경우를 구분하라는 뜻이다. 프로퍼티 기능은 이외의 파운데이션 이외의 변경 사항의 경우, 여러개 인스턴스를 만들지 말고 프로퍼티로 간소하게 제작해도 된다는 뜻이다.
아래 텍스트 프로퍼티는 해당 내용 '라벨'을 숨기거나 표시하기 위해 boolean property 를 사용할 것이다.
1. 부울린 프로퍼티(boolean property)
또한, 텍스트 필드 제목(라벨)에 써질 내용을 하나만 편집해서 여러개에 적용하기 위해 텍스트 프로퍼티를 적용한다. 아래의 버튼을 누르면 된다.
2. 텍스트 프로퍼티(Text property)
