스크롤 다운 화면 만들시 상단 view 고정 시켜야하는데 보통 stickyHeaderIndices={ [ number ] } 로 고정시킨다.

다만 ScrollView에서 stickyHeaderIndices로 고정하면서 Animated.View로 height, ... 애니메이션 효과 주려할때 

'stickyHeaderIndices style property height is not supported by native animated module' 에러가 발생하면서 애니메이션 효과를 줄수가 없다.

솔루션 코드는 여기에 있다. - https://gist.github.com/BoBinLee/76f13317e135adc16a7eae42fe4aab7e

해결방법은 간단하다.

View를 한번더 감싸고 감싼 View style={{ height: 1 }}을 주면 끝.

원하는 방식대로 동작하는 것을 확인할 수 있다.

설정

트랙백

댓글

html, body { height: 100%; } 

footer { positive: absolute; bottom: 0; }

footer감싸고 있는 wrapper { positive: relatvie; min-height: 100%; }


<body>

<div class="wrapper">

<div class="content">


</div>

<div class="footer">

Footer

</div>

</div>

</body>

기본적으로 이렇게하면 적용된다.

div 깊이가 있을 경우

<div class="depth-2-wrapper">

<div class="wrapper">

...

</div>

</div>

depth-2-wrapper height: 100% 로 유지시켜줘야한다.

설정

트랙백

댓글

IOS Safari 브라우져에서 제공하는 minimal-ui 기능 ( 툴바가 쪼그라드는 기능 or 툴바 사라짐 기능 )을 사용하기 위해 몇가지 수정사항이 존재하였다.

경험을 토대로 설명하고자 한다.

<meta name="viewport" content="minimal-ui"> minimal-ui 추가한다. 

- body { height: 100%; overflow: auto 혹은 scroll; }을 명시하여 body에서 스크롤이 가능하면 끝.

이때 주의해야할 점은 하의 div들 중 { overflow: auto, scroll; } 이 가능하면 해당 엘리멘트가 스크롤 되기 때문에 위 minimal-ui 기능이 동작하지 않는다.

즉, window.addEventListener('scroll', this.onScroll); 추가 시 해당 스크롤이 동작하면 된다.

위 두가지 조건이 만족하면 safari에서 툴바가 쪼그라드는걸 볼 수 있다.


참고

https://stackoverflow.com/questions/18793072/impossible-to-hide-navigation-bars-in-safari-ios-7-for-iphone-ipod-touch

설정

트랙백

댓글

Node 버전 관리

N 2017. 9. 1. 17:33

https://github.com/tj/n

노드 버젼에 맞게 맞추어 변경할 수 있다.

설정

트랙백

댓글

React Reducer 관리

R/React 2017. 8. 17. 06:11
AS
import _ from 'lodash';
import { FETCH_READY_COMMENT, FETCH_COMMENT_SUCCESS, FETCH_COMMENT_ERROR,
  ADD_READY_COMMENT, ADD_COMMENT_SUCCESS, ADD_COMMENT_ERROR } from './CommentActions';

const initialState = {
  comments: [],
};

const CommentReducer = (state = initialState, action) => {
  switch(action.type) {
    case ADD_READY_COMMENT:
      return {
        ...state,
        comments: [...state.comments, action.comment]
      };
    case ADD_COMMENT_SUCCESS:
      return {
        ...state,
        comments: _.map(state.comments, comment =>
          (comment.id === action.id ? { ...comment, id: action.newId } : comment))
      };
    case ADD_COMMENT_ERROR:
    default:
      return state;
  }
};

export default CommentReducer;
TO BE
...

const addCommentReducer = {
  [ADD_READY_COMMENT]: (state, action) => ({
    ...state,
    comments: [...state.comments, action.comment]
  }),
  [ADD_COMMENT_SUCCESS]: (state, action) => ({
    ...state,
    comments: _.map(state.comments, comment =>
      (comment.id === action.id ? { ...comment, id: action.newId } : comment))
  }),
  [ADD_COMMENT_ERROR]: (state, action) => ({
    ...state,
    comments: _.filter(state.comments, comment => (comment.id !== action.id))
  })
};

function createReducer(initialState, handlers) {
  return function reducer(state = initialState, action) {
    if (handlers.hasOwnProperty(action.type)) {
      return handlers[action.type](state, action);
    } else {
      return state;
    }
  };
}

const CommentReducer = createReducer(initialState, {
  ...addCommentReducer,
});

export default CommentReducer;
- createReducer 메소드를 하나 만들어 switch 문이 아닌 객체 속성으로 액션타입에 맞는 리듀서를 찾는다. http://redux.js.org/docs/recipes/ReducingBoilerplate.html#generating-reducers 
- 타입별 묶음으로 관리하면 리듀서 구분이 쉬워진다.


'R > React' 카테고리의 다른 글

React Heroku 초기 세팅.  (0) 2017.07.28

설정

트랙백

댓글

React Heroku 세팅하는 방법이 아래에 잘 나와있다.

http://revelry.media/tech-talk/2016/2/15/getting-a-simple-react-app-on-heroku


보통 리액트 프로젝트에 적용하려면 webpack -p 에서 not found 에러가 발생하는 데 heroku 기본 환경 세팅이 NPM_CONFIG_PRODUCTION=true 라 false로 바꾸어 줘야 devDependency 패키지도 install 하여 webpack -p 가 잘 동작한다.


끝.

'R > React' 카테고리의 다른 글

React Reducer 관리  (0) 2017.08.17

설정

트랙백

댓글

SOLID

J/Java 2017. 6. 12. 18:00
  1. 단일 책임 원칙 (Single responsibility principle)

    클래스는 단 한개의 책임을 가져야 한다. 
    클래스 변경은 단 하나여야만 한다.

    단일 책임 원칙
    public class DataViewer {
     
       public void display(){
          String data = loadHtml();
          updateGui(data);
       }
     
        //
        public String loadHtml(){
            HttpClient client = new HttpClient();
            client.connect(url);
            return client.getResponse();
        }
     
       private void updateGui(String data){
          GuiData guiModel = parseDataToGuiData(data);
    //    tableUI.changeData(guiModel);
       }
     
       private GuiData parseDataToGuiData(String data) {
          return null;
       }
    }

    DataViewer에서 데이터 화면을 보여주는 display, updateGui, parseDataToGuiData 와 Html을 로드하는 loadHtml 메소드가 있다. DataViewer이라는 클래스에 화면을 보여주는 책임을 갖고 있지만 loadHtml이라는 html을 로드하는 부분도 포함되어있어 Single responsibility principle에 어긋나게 된다.
     

    단일 책임 원칙 DataViewer - DataLoader 분리
    public class DataViewer {
       DataLoader<String> dataLoader;
     
       public void display(){
          String data = dataLoader.loadHtml();
          updateGui(data);
       }
     
       private void updateGui(String data){
          GuiData guiModel = parseDataToGuiData(data);
    //    tableUI.changeData(guiModel);
       }
     
       private GuiData parseDataToGuiData(String data) {
          return null;
       }
    }
     
     
    public class DataLoader<T> {
     
       public T loadHtml() {
          HttpClient<T> client = new HttpClient<T>();
     
          client.connect();
          return client.getResponse();
       }
     
       class HttpClient<T> {
          private T response;
     
          public void connect() {
     
          }
     
          public T getResponse() {
             return response;
          }
       }
     
    }

    따라서 DataLoader 클래스를 따로 두어 분리한다. 


  2. 개방 폐쇄 원칙 (Open-closed principle)
    확장에는 열려 있어야 하고, 변경에는 닫혀 있어야 한다.
    기능을 변경하거나 확장할 수 있으면서 그 기능을 사용하는 코드는 수정하지 않는다.


  3. 리스코프 치환 원칙 (Liskov substitution principle)

    상위 타입의 객체를 하위 타입의 객체로 치환해도 상위 타입을 사용하는 프로그램은 정상적으로 동작해야 한다.
    파생 클래스는 부모 클래스와 치환되더라도 문제가 없어야 한다.
    부모 클래스가 제공하는 메소드 형태를 따라 기능을 제공해야 한다.
    파생 클래스는 확장이 주요 목적이다. 추가는 부차적인 문제이다.

    ex) Rectangular, Square 상속 관계

  4. 인터페이스 분리 원칙(Interface segregation principle)

    인터페이스는 그 인터페이스를 사용하는 클라이언트를 기준으로 분리해야 한다.

    ex) Java Swing의 JTable, Android Activity의 View?

  5. 의존 역전 원칙(Dependency inversion principle)

    고수준 모듈은 저수준 모듈의 구현에 의존해서는 안 된다. 저수준 모듈이 고수준 모듈에서 정의한 추상 타입에 의존해야한다.


설정

트랙백

댓글

소나 버그 잡기

S 2017. 6. 12. 16:45

Use constructor injection for this field

@Inject
private XXXService xxxService;

why? http://olivergierke.de/2013/11/why-field-injection-is-evil/

Or Inject -> Autowired ( Autowired 와 Inject 차이 - http://dev-eido.tistory.com/entry/Autowired-Resource-Inject%EC%9D%98-%EC%B0%A8%EC%9D%B4 )

'S' 카테고리의 다른 글

Scala  (0) 2017.05.05
SSH 접속 끊김  (0) 2017.03.20
deview 2014 - 월요일  (0) 2014.10.07
jboss 서버 utf-8 설정  (0) 2014.07.19
<모델1과 모델2>  (0) 2012.01.02

설정

트랙백

댓글

QueryDSL 문서

J/JPA 2017. 6. 12. 16:41

상수 값 넣기

NumberTemplate.ZERO.castToNum(BigDecimal.class)


'J > JPA' 카테고리의 다른 글

영속성 관리  (0) 2015.11.22

설정

트랙백

댓글

엑셀 SQL 구문 추출

P/Python 2017. 6. 12. 16:38

Insert

import sys
from openpyxl import load_workbook

reload(sys)
sys.setdefaultencoding('utf-8')

file_name = sys.argv[1]
table_name = sys.argv[2]

wb = load_workbook(file_name)
ws = wb.active

def row_name_value(row_num):
row_values = []
for col in ws.columns:
row_values.append((col[0].value, col[row_num].value))
return row_values

def makeSql(table_name, name_value_list):
keymap = set(["now()", "null"])
names = ''
values = ''

for (name, value) in name_value_list:
if not value:
value = "0"
names = names + '{0},'.format(name)
if value not in keymap:
values = values + "'{0}',".format(value)
else:
values = values + "{0},".format(value)
if names[-1] == ',':
names = names[:-1]
if values[-1] == ',':
values = values[:-1]
return "insert into {0} ({1}) values({2});".format(table_name, names, values)

with open('{0}.sql'.format(file_name), 'w') as fw:
for idx in range(1, ws.max_row):
sql = makeSql(table_name, row_name_value(idx)) + '\n'
fw.write(sql)


Update

import sys
from openpyxl import load_workbook

reload(sys)
sys.setdefaultencoding('utf-8')

file_name = sys.argv[1] # test.xlsx
table_name = sys.argv[2] # schema.table

wb = load_workbook(file_name)
ws = wb.active

def row_name_value(row_num):
row_values = []
for col in ws.columns:
row_values.append((col[0].value, col[row_num].value))
return row_values

def makeSql(table_name, name_value_list):
keymap = set(["now()", "null"])
update_datas = ''
where_clause = "{0} = '{1}'".format(name_value_list[0][0], name_value_list[0][1])

for (name, value) in name_value_list[1:]:
# print value, name
if not value or "*" not in name:
continue
name = name.replace("*", "")
if value not in keymap:
update_datas = update_datas + "{0} = '{1}',".format(name, value)
else:
update_datas = update_datas + "{0} = {1},".format(name, value)
if update_datas[-1] == ',':
update_datas = update_datas[:-1]
return "update {0} set {1} where {2};".format(table_name, update_datas, where_clause)

with open('{0}.sql'.format(file_name), 'w') as fw:
for idx in range(1, ws.max_row):
sql = makeSql(table_name, row_name_value(idx)) + '\n'
fw.write(sql)


'P > Python' 카테고리의 다른 글

DB 설치  (0) 2016.12.10

설정

트랙백

댓글