http://www.flutterbyexample.com/#/posts/inherited_widgets

 

Flutter by Example

 

www.flutterbyexample.com

위 글에 대한 내용입니다.

 

플러터 에서 sdk 의 모든 부분이 개발자에게 노출되어 있고 개발자는 상속된 위젯의 장점을 이용할수 있다.

 

또한 커스텀한 상속 위젯을 "built-in central state storage" 처럼 사용할수 있습니다. "Redux Store" 나 "Vue 의 Vuex Store" 처럼 말이죠.

아래는 예시 소스 입니다.

1
2
3
4
5
6
@override
Widget build(context) {
  return new Text('Hello, World',
    style: new TextStyle(color: Theme.of(context).primaryColor),
  );
}
http://colorscripter.com/info#e" target="_blank" style="color:#4f4f4ftext-decoration:none">Colored by Color Scripter

"Lifting State Up" 아키텍처

statefulwidget 에서 상태관리 툴

'Flutter' 카테고리의 다른 글

BuildContext() 란  (0) 2020.02.12

http://www.flutterbyexample.com/#/posts/build_context

 

Flutter by Example

 

www.flutterbyexample.com

위의 글을 번역(의역) 했습니다.

 

"BuildContext 이란?" 간단한 설명 

 - widget 트리 에서 Widget 의 위치.

- 부모 widget 의 build 메소드가 리턴한 context 정보)


build 메소드 안의 context 와 클레스 안에 있는 context 는 동일한거가 아닙니다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
class _MyHomePageState extends State<MyHomePage> {
  _MyHomePageState() {
    print(context.hashCode);
    // prints 2011
  }
 
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text(widget.title),
      ),
      body: new Container(),
      floatingActionButton:
          new FloatingActionButton(onPressed: () => print(context.hashCode)),
          // prints 63
    );
  }
}
 

- 잘못된 context ,build 를 사용하기 쉬우니 조심해야함. ( of(context) 를 사용하면 알수있음 )

- of(context) 메소드를 통해서  그 widget 정보를 가져올수 있음.

 

The 'of()' Method

플러터에서는 모든게 widget 이다, 위젯 트리구조 에서 다른 위젯을 참조하기 위해선 약간의 기능이 필요로 하다.

특히 상속한 위젯들을 참조하기 위해서는 "of()" 메소드 형태를 사용한다.

1
2
3
4
5
6
@override
Widget build(context) {
  return new Text('Hello, World',
    style: new TextStyle(color: Theme.of(context).primaryColor),
  );
}

부모 Widget 의 'Theme' Widget primaryColor 값을 가져오는 소스(build 메소드의 context 가 부모와의 관계를 알수 있음)

 

'Flutter' 카테고리의 다른 글

Inherited Widgets 상속된 위젯  (0) 2020.02.12

App Transport Security 란?

 

App Transport Security

>iOS 9.0또는 OS X 10.11 이상 유효하며, 응용프로그램과 웹 서비스간의 안전한 연결을 위해 사용할 수 있음

>ATS가 활성화되면 HTTP를 통해 통신을 할 수 없음

>Apple에서 권장하는 요구 사항을 충족하지 않는 연결은 강제로 연결 실패 처리.

>App Transport Security has blocked a cleartext HTTP (http://) resource load since it is insecure. 

 

flutter 개발시 현상 

 안드로이드 시뮬레이터 : 웹뷰(WebView)에서 URL 호출시 ERR_CLEARTEXT_NOT_PERMITTED 발생

 IOS 시뮬레이터 : 페이지 열리지 않음.

 

수정방법

1. android/app/src/main/AndroidManifest.xml

 

android:icon="@mipmap/ic_launcher"

android:usesCleartextTraffic="true"><application
        android:name="io.flutter.app.FlutterApplication"
        android:label="flutter_webviews"
        android:icon="@mipmap/ic_launcher">
        android:icon="@mipmap/ic_launcher"
        android:usesCleartextTraffic="true">
        <activity
            android:name=".MainActivity"
            android:launchMode="singleTop"

 

2. ios/Runner/Info.plist

 

<key>NSAppTransportSecurity</key>

<dict>

<key>NSAllowsArbitraryLoads</key>

<true/>

</dict>

1. 커스텀 어노테이션 생성.

2. validate 부분 작성.

3. VO에 적용.

 

1.  커스텀 어노테이션 생성.

@Target({ ElementType.TYPE, ElementType.ANNOTATION_TYPE})
@Retention(RetentionPolicy.RUNTIME)
@Constraint(validatedBy = FromDateBeforeOrSameAsToDateValidator.class)
@Documented
public @interface FromDateBeforeOrSameAsToDate {
    String message() default "시작일은 종료일보다 클수 없습니다";

    Class[] groups() default {};

    Class[] payload() default {};

    String searchFromDt();

    String searchEndDt();

    @Target({ElementType.TYPE, ElementType.ANNOTATION_TYPE})
    @Retention(RetentionPolicy.RUNTIME)
    @Documented
    @interface List
    {
        FromDateBeforeOrSameAsToDate[] value();
    }
}

 

2. validate 작성.

public class FromDateBeforeOrSameAsToDateValidator implements ConstraintValidator<FromDateBeforeOrSameAsToDate, Object> {

    private String searchFromDt;
    private String searchEndDt;

    @Override
    public void initialize(FromDateBeforeOrSameAsToDate constraintAnnotation) {
        searchFromDt = constraintAnnotation.searchFromDt();
        searchEndDt = constraintAnnotation.searchEndDt();
    }

    @Override
    public boolean isValid(Object requestObject, ConstraintValidatorContext constraintValidatorContext) {
        Field fromDateField = FieldUtils.getField(requestObject.getClass(), searchFromDt, true);
        Field toDateField = FieldUtils.getField(requestObject.getClass(), searchEndDt, true);

        String fromLocalDate = (String) ReflectionUtils.getField(fromDateField, requestObject);
        String toLocalDate = (String) ReflectionUtils.getField(toDateField, requestObject);

        SimpleDateFormat transFormat = new SimpleDateFormat("yyyyMMdd");
        transFormat.setLenient(false); //유효한 날짜인지 체크 예를들어 2019/01/32 이런거 체크
        Date from = new Date();
        Date to = new Date();

        if (fromLocalDate == null || toLocalDate == null) {
            return true;
        }

        try {
             from = transFormat.parse(fromLocalDate);
             to = transFormat.parse(toLocalDate);
            if(from.compareTo(to) > 0){ // Date 1 occurs after Date 2
                return false;
            }
        } catch (ParseException e) {
            constraintValidatorContext.buildConstraintViolationWithTemplate("유효하지 않은 날짜 입니다.") .addConstraintViolation();
            return false;
        }

        constraintValidatorContext.disableDefaultConstraintViolation();
        constraintValidatorContext.buildConstraintViolationWithTemplate(
                "시작일은 종료일보다 클수 없습니다.")
                .addConstraintViolation();

        return fromLocalDate.equals(toLocalDate) ||  (from.compareTo(to) < 0);
    }
}

 

3. VO에 적용.

@FromDateBeforeOrSameAsToDate.List({ @FromDateBeforeOrSameAsToDate(searchFromDt = "regStartDate", searchEndDt = "regEndDate" })
public class EmployeeContractDelivery extends BaseObject {

        /*등록시작일자*/
        private String regStartDate;
        /*등록종료일자*/
        private String regEndDate;

 

        public String getRegStartDate() {
            return regStartDate;
        }  
        public void setRegStartDate(String regStartDate) {
            this.regStartDate = regStartDate;
        }
        public String getRegEndDate() {
            return regEndDate;
        }
        public void setRegEndDate(String regEndDate) {
            this.regEndDate = regEndDate;
        }

}

'Web개발 > Java' 카테고리의 다른 글

Url PathVariable 변수명 가져오기  (0) 2020.03.05
@SpringBootTest 와 @WebMvcTest 차이  (0) 2019.07.07

@WebMvcTest 는 컨트롤러 테스트할때 (아래와같이 간단한 controller테스트할때)

 

ex) mvc.perform(get"/xxxxx/zzzzz").accept(MediaType.APPLICATION_JSON))

.andExpect(status().isOk()

.print());

 

@SpringBoootTest 는 어플리케이션 컨텍스트 설정정보 등 모두 불러와 웹서버에 연결을 시도. (WebMvcTest 보다 많이 무겁겠죠?)

 

그럴땐 TestRestTemplate 를 사용. 다음에 TestRestTemplate 에 대해 마져 쓰기.

'Web개발 > Java' 카테고리의 다른 글

Url PathVariable 변수명 가져오기  (0) 2020.03.05
날짜 유효성 체크 어노테이션  (0) 2019.12.04

결함 : 모바일 웹에서 이모티콘 저장하니까 QA 에서 결함 올려서 처리

원인 : 이모티콘(emoji) 는 4byte 에 해당하는 유니코드로 오라클 charset UTF-8 (3byte) 에는 없어서 ??? 로 저장됨.

 

1)이모티콘 정규식 체크해서 저장 못하게.

2) mysql charset 변경 : utf8mb4 로 변경 (확인해보지 못함)

3) 오라클. 나중에 해보자

<!--이모티콘 체크로직 -->

<input id="emojiText" value="" onchange="">

<script type="text/javascript">

        var hw = document.getElementById('emojiText');

        hw.addEventListener('change', function(){

            console.log(hw.value);

            var reg = /(\u00a9|\u00ae|[\u2000-\u3300]|\ud83c[\ud000-\udfff]|\ud83d[\ud000-\udfff]|\ud83e[\ud000-\udfff])/g; 

        var testing = reg.test( hw.value );

            if( testing ){

            alert("이모티콘은 입력하지 마세요.");

            hw.value = hw.value.replace(reg, '');

            return false;

            }

        })

<!--이모티콘 체크로직 --> 

 

'Web개발 > Javascript' 카테고리의 다른 글

Jquery 로 특정영역 밖 클릭 toggle  (0) 2020.08.11

+ Recent posts