Search results for '파이어몽키'

  1. 2015.07.02 -- 모바일 앱 실행 시 검은화면이 표시되는 경우 조치방법
  2. 2015.06.26 -- [하이브리드 앱 개발] 웹페이지에서 델파이 함수 호출하기
  3. 2015.06.25 -- TWebbrowser의 "tel:, sms:" 링크가 동작하지 않는 이슈 해결방법
  4. 2015.06.09 -- 개발환경 설정 - 안드로이드 개발환경
  5. 2015.06.04 -- 앱의 상태바(StatusBar) 제어하기(색상변경, 감추기, 투명하게)
  6. 2015.06.04 -- [XE8] 스피드버튼의 이미지를 크게 표시할 수 있습니다.
  7. 2015.05.18 -- [JVESoft] 광고와 결재 컴포넌트(AdMob, Paypal 등)
  8. 2015.05.18 -- [iOS] 배포파일 아이클라우드 백업 옵션설정하기
  9. 2015.04.14 -- 파이어몽키에서 외부 라이브러리 연동하기(jar, so, a) (3)
  10. 2015.03.04 -- [FMX] ListBox 전체체크 기능 구현하기
  11. 2015.02.24 -- [XE7] iOS 시뮬레이터 배포 시 'Please specify exact device preset UUID.' 오류 대응
  12. 2015.02.23 -- 파이어몽키 용 그리드 컴포넌트 안내 - FirePower
  13. 2015.02.12 -- [XE7] 안드로이드 블루투스 활성화 조회와 설정하기
  14. 2015.02.11 -- [XE7] 안드로이드 WiFi 상태조회와 설정하기
  15. 2015.02.09 -- 태블릿용 멀티컬럼 리스트뷰 ItemAppearace 만들기 (6)
  16. 2015.01.28 -- 트루타입 폰트(FontAwesome) 파일을 이용해 아이콘 표시하기(안드로이드, iOS)
  17. 2015.01.23 -- [XE7] 안드로이드 L 스타일팩 다운로드
  18. 2015.01.13 -- 안드로이드에 설치된 앱 목록(AppList)을 표시하는 앱(소스코드 공개)
  19. 2015.01.07 -- [XE7] 안드로이드 4.4 스타일의 대화상자 사용하기
  20. 2014.12.22 -- 커스텀 폰트 배포와 사용하기(Android/iOS)

모바일 앱 실행 시 검은화면이 표시되는 경우 조치방법

2015.07.02 16:39

모바일 기기에 앱을 넣고 실행해보면 가끔 어찌된 영문인지 앱 실행 시 검은화면이 표시되고 더이상 구동되지 않는 경우가 발생합니다. 

검은화면은 앱 실행 시 오류가 발생한 경우 표시됩니다.


실행 시 발생하는 오류는 다양하지만 자주 발생하는 이슈는 아래와 같습니다.

  • FormCreate, FormShow 이벤트에 작성한 코드에서 오류 발생
  • 컴포넌트 Enable(또는 Active) 속성을 True로 설정 후 실행하면 실행 시 활성화 되고 활성화 시 오류 발생 가능
  • 필요한 라이브러리가 함께 배포되지 않은 경우
  • (안드로이드 경우)권한이 없는 기능을 사용한 앱이 구동 시 오류 발생

위 내용의 조치방법은 아래와 같습니다.

1, FormCreate(또는 FormShow) 이벤트에 작성한 코드에서 오류 발생

FormCreate 또는 FormShow 이벤트핸들러에 작성한 코드에서 오류가 발생하면 구동 시 검은 화면이 발생합니다.

오류가 발생하지 않도록 코드를 점검하고, 예외처리(try..except)를 추가하기 바랍니다.


또, 라이프사이클 이벤트를 이용해 앱 완전 구동 후 작업을 수행할 수 있습니다.

2, 컴포넌트 Enable(또는 Active)속성을 True로 설정 후 실행하면 실행 시 활성화 되고 활성화 시 오류 발생 가능

폼위에 올려놓은 컴포넌트도 내부적으로는 앱이 실행될때 코드가 실행됩니다. 특히 Enable과 Active 속성을 갖는 컴포넌트의 경우 앱 실행 시 활성화됩니다. 이때 컴포넌트 활성화에 필요한 정보가  설정되지 않은 경우 오류가 발생합니다.

예를 들어 DB 연결 시 DB의 경로가 플랫폼의 경로로 설정되지 않았다면, 오류가 발생할 수 있습니다.


이 경우, 앱이 구동된 이후 Enabled, Active 속성을 True로 변경하도록 처리하기 바랍니다.

3, 필요한 라이브러리가 함께 배포되지 않은 경우 오류가 발생할 수 있습니다.

데이터 연결 등 외부 라이브러리를 이용하는 경우, 외부 라이브러리 배포를 하지 않고 앱을 실행하면 구동 시 오류가 발생합니다.


이 경우, 배포관리자(Project > Deployment) 화면에서 필요한 라이브러리를 추가하기 바랍니다.

그리고, 플랫폼별 배포경로를 다음 링크에서 확인해 Remote Path를 설정하기 바랍니다.

팁으로 데이터 엑세스 관련된 라이브러리 파일은 Add Featured Files 기능을 이용해 추가할 수 있습니다.


4, (안드로이드 경우)권한이 없는 기능을 사용한 앱이 구동 시 오류가 발생할 수 있습니다.

블루투스 컴포넌트를 폼에 올리고 안드로이드에서 앱을 실행하려면 블루투스 권한을 설정해야 합니다.


사용 권한은 프로젝트 옵션(Project > Option > Uses Permissions)에서 설정할 수 있습니다. 


권한에 대한 자세한 정보는 엠바카데로 기술문서를 참고하세요.

5, 기타 오류가 발생할 수 있는 경우

멀티-디바이스 뷰를 추가 후 추가한 뷰에 설정 값을 잘 못 넣은 경우

위 그림과 같이 멀티-디바이스 디자이너는 여러가지 플랫폼과 해상도에 맞는 디바이스 뷰를 추가해 폼 디자인을 다르게 구성할 수 있습니다.


간혹, 디자인 뿐 아니라 연결 컴포넌트 등의 속성을 추가한 뷰(위 그림에서 Android 5" Phone)에 잘못된 설정을 하고, Master 뷰에서 원인을 찾을 경우 쉽게 못찾는 경우가 있습니다.


위 문제의 해결책은 되도록, 연결 등의 Non-visual 컴포넌트는 데이터모듈에 추가하도록 합니다. 부득이 폼에 추가한 경우 Master 뷰에서 속성을 변경 해 추가한 뷰에서 Master의 속성을 상속받아 실행되도록 합니다.

저작자 표시 비영리 동일 조건 변경 허락
신고

험프리.김현수 파이어몽키

[하이브리드 앱 개발] 웹페이지에서 델파이 함수 호출하기

2015.06.26 14:00

델파이는 성능좋은 네이티브 모바일 앱을 개발할 수 있는 개발 도구입니다.

모든 기능을 네이티브로 개발할 수 있지만, 이미 반응형 웹페이지를 갖고 있는 경우 일부 기능을 웹브라우를 통해 구현해 하이브리드 형태로 개발 할 수 있습니다.


이 경우 델파이 코드에서 웹페이지의 자바스크립트를 호출하는 방법은 웹브라우저에서 제공하는 메소드(EvaluateJavaScript)를 사용할 수 있지만, 반대로 웹브라우저에서 델파이 코드를 호출하는 방법은 잘 모르실 것 같아 샘플을 만들어 공개합니다.


이글에서는 다음 기능을 소개합니다.

  • 델파이 코드로 웹브라우저의 자바스크립트 코드 호출하기
  • 웹브라우저에서 델파이 메소드 호출하기(파라메터 포함)


기본 구성

❑ 웹페이지 구성

웹페이지(http://hjf.pe.kr/fmx/hybrid.php)의 자바스크립트 코드는 다음과 같습니다.

웹페이지에서 델파이 코드 호출은 아래와 같이 2개의 버튼으로 처리합니다..

	

❑ 델파이 앱 화면 구성


델파이에서 자바스크립트 호출하기

델파이에서 웹브라우저 안의 자바스크립트 호출은 EvaluateJavaScript 메소드를 이용합니다. 자바스크립트 함수 뿐 아니라 여러줄의 구문도 실행할 수 있습니다.

델파이 코드

델파이에서 자바스크립트의 callJSMethodFromDelphi 함수 실행

procedure TForm1.Button1Click(Sender: TObject);
begin
  WebBrowser1.EvaluateJavaScript('callJSMethodFromDelphi();');
end;

웹페이지의 자바스크립트 코드

자바스크립트는 다음과 같이 메시지 다이얼로그를 출력하도록 되어있습니다.

function callJSMethodFromDelphi(){
	alert("[JS] Call from delphi");
}

테스트 결과

EvaluateJavaScript 메소드 자세히 보기(웹브라우저 html 코드를 적용할 수 있는 LoadFromStrings 메소드도 활용도가 높습니다.)

웹페이지에서 델파이 메소드 호출하기

웹페이지에서 델파이 메소드를 호출하는 원리는 아래와 같습니다.

  1. 델파이는 웹브라우저 주소가 변경되면 이벤트를 받을 수 있다.
  2. 웹페이지에서 웹브라우저 주소를 변경할 수 있다.
  3. 웹페이지에서 주소를 http:// 형태의 페이지 주소가 아닌, 델파이 메소드를 호출하라는 사용자 포맷의 주소를 호출한다.
  4. 델파이에서 주소 변경 이벤트 발생 시 사용자포맷 주소인 경우, 주소를 분석 해 델파이 메소드를 호출한다.

❑ 델파이 파이어몽키용 웹브라우저 주소 변경 이벤트 종류

웹브라우저(TWebBrowser)의 주소변경 이벤트는 다음과 같습니다.

이벤트

 발생 조건

 OnDidFailLoadWithError

  페이지 로드 중 에러가 난 경우 발생

 OnDidFinishLoad

  페이지 로드가 완료한 경우 발생
 OnDisStartLoad  페이지 로드를 시작할때 발생
 OnShouldStartLoadWithRequest

  요청에 의해 페이지 로드를 시작할때 발생


이 데모에서는 페이지 로드 요청 시 발생하는 OnShouldStartLoadWithRequest 이벤트를 이용합니다.

(메소드 호출과정에 페이지가 로드되지 않기 때문에 OnDisStartLoad 이벤트는 발생하지 않습니다.)


❑ 웹페이지에서 델파이 메소드 호출하기

웹페이지에서 델파이 메소드 호출은 아래 자바스크립트를 호출해 동작합니다.

function callDelphiMethodFromJS(){
	window.location = "jscall://callDelphiMethodFromJS";
}

function callDelphiMethodFromJSWithParam(){
	window.location = "jscall://callDelphiMethodFromJSWithParam?Hello|1234";
}


위 자바스크립트 코드는 웹페이지 주소(window.location)를 변경하는 코드로, 사용자 포맷(jscall://)으로 주소를 변경합니다.


제가 정의한 포맷은 다음과 같습니다.(임의로 정한 규칙임으로 원하는 방식으로 정의해서 사용하기 바랍니다.)

 포맷 정의

용도 

 jscall:// 

 델파이 코드를 호출하는 주소라는 의미

 callDelphiMethodFromJSWithParam

 호출할 델파이 코드명

 ?Hello|1234

 "?" 뒤에는 파라메터를 추가합니다. 파라메터는 파이프("|")로 구분합니다.


다음으로 웹페이지에서 위 포맷으로 주소 변경 시, 델파이에서 감지해 메소드를 호출하도록 구현합니다.

❑ 델파이에서 사용자 포맷 주소 감지하고 분석하기

델파이 웹브라우저 OnShouldStartLoadWithRequest 이벤트에는 아래와 같이 구현했습니다.

procedure TForm1.WebBrowser1ShouldStartLoadWithRequest(ASender: TObject;
  const URL: string);
var
  MethodName: string;
  Params: TArray;
begin
  if ProcessMethodUrlParse(URL, MethodName, Params) then
  begin
    CallMethod(MethodName, Params);
  end;
end;


ProcessmethodUrlParse 메소드로 URL을 분석하고, 메소드 URL인 경우 메소드를 호출하는 CallMethod를 호출합니다.

메소드 URL 분석

// URL format
//  jscall://{method name}?{Param1}|{ParamN}
//  e.g> jscall://callDelphiMethodFromJSWithParam?Hello|1234
function TForm1.ProcessMethodUrlParse(AUrl: string;
  var MethodName: string; var Parameters: TArray<TValue>): Boolean;
const
  JSCALL_PREFIX = 'jscall://';
  JSCALL_PREFIX_LEN = Length(JSCALL_PREFIX);
var
  I: Integer;
  ParamStr: string;
  ParamArray: TArray;
begin
  Result := False;

  // iOS에서 특수기호(|)가 멀티바이트로 넘어옴
  AUrl := TNetEncoding.URL.Decode(AUrl);

  if AUrl.IndexOf(JSCALL_PREFIX) = -1 then
    Exit(False);

  if AUrl.IndexOf('?') > 0 then
  begin
    MethodName := AUrl.Substring(JSCALL_PREFIX_LEN, AUrl.IndexOf('?')-JSCALL_PREFIX_LEN);

    ParamStr := AUrl.Substring(AUrl.IndexOf('?')+1, Length(AUrl));
    ParamArray := ParamStr.Split(['|']);
    SetLength(Parameters, length(ParamArray));
    for I := 0 to Length(ParamArray)-1 do
      Parameters[I] := ParamArray[I];
  end
  else
    MethodName := AUrl.Substring(JSCALL_PREFIX_LEN, MaxInt);
  if MethodName.IndexOf('/') > 0 then
    MethodName := MethodName.Replace('/', '');

  Result := not MethodName.IsEmpty;
end;

❑ 분석한 메소드 호출

웹페이지에서 호출할 델파이 메소드는 아래와 같이 자바스크립트와 동일한 이름으로 작성했습니다.

procedure TForm1.callDelphiMethodFromJS;
begin
  ShowMessage('[DELPHI] Call from JS');
end;

procedure TForm1.callDelphiMethodFromJSWithParam(AStr1, AStr2: string);
begin
  ShowMessage(Format('[DELPHI] Call from JS(%s, %s)', [AStr1, AStr2]));
end;

텍스트 타입의 메소드이름으로 메소드를 호출하는 방법은 간단하게 조건문으로 호출하는 방법도 있고, RTTI를 이용해 메소드이름으로 메소드를 찾아 호출하는 방법으로도 구현할 수 있습니다.

조건문으로 메소드 호출

function TForm1.CallMethod(AMethodName: string; AParameters: TArray<TValue>): TValue;
begin
  if AMethodName = 'callDelphiMethodFromJS' then
    callDelphiMethodFromJS
  else if AMethodName = 'callDelphiMethodFromJSWithParam' then
    callDelphiMethodFromJSWithParam(AParameters[0].AsString, AParameters[1].AsString);
end;


RTTI를 이용해 메소드 호출

function TForm1.CallMethod(AMethodName: string; AParameters: TArray<TValue>): TValue;
var
  RttiCtx: TRttiContext;
  RttiTyp: TRttiType;
  RttiMtd: TRttiMethod;
begin
  RttiCtx := TRttiContext.Create;
  RttiTyp := RttiCtx.GetType(Self.ClassInfo);
  if Assigned(RttiTyp) then
  begin
    RttiMtd := RttiTyp.GetMethod(AMethodName);
    if Assigned(RttiMtd) then
      Result := RttiMtd.Invoke(Self, AParameters);
  end;
  RttiMtd.Free;
  RttiTyp.Free;
  RttiCtx.Free;
end;

테스트 결과



<주의>

안드로이드 앱의 웹브라우저에서 델파이 코드 호출 시 ERR_UNKNOWN_URL_SCHEME 오류가 발생하는 경우 다음 글을 참고해 조치하기 바랍니다.


 - http://blog.hjf.pe.kr/378


샘플 다운로드

다운로드 : 

HybridAppDemoSrc.zip



저작자 표시 비영리 동일 조건 변경 허락
신고

험프리.김현수 파이어몽키

TWebbrowser의 "tel:, sms:" 링크가 동작하지 않는 이슈 해결방법

2015.06.25 19:31

델파이로 하이브리드 앱 개발 시 안드로이드 환경에서 전화걸기 링크(tel:)를 클릭하면 웹페이지 오류(ERR_UNKNOWN_URL_SCHEME)가 표시됩니다.

원래는 전화걸기 기능이 실행되야 합니다.


이 글은 안드로이드 하이브리드 앱에서 웹브라우저(TWebBrowser)의 전화걸기, 문자전송 등의 링크 클릭 시 해당 기능이 동작하도록 처리하는 방법을 안내합니다.


먼저 웹페이지의 구성과 증상을 살펴봅니다.

웹페이지 구성과 증상

웹페이지(http://hjf.pe.kr/fmx/hybrid.php)에는 아래와 같이 전화걸기, 문자전송, 메일 전송 링크를 제공합니다.

	[Phone number]  / 
	[Send sms]  / 
	[Send mail]


위 페이지를 안드로이드 앱의 웹브라우저에 표시하고, 전화걸기 링크를 클릭하면 다음과 같이 웹 페이지 오류가 표시됩니다.

위 오류가 발생하는 원인은 링크를 클릭하면 관련 액티비티가 처리해야 하는데 웹페이지로 인식해 웹브라우저가 분석하는데 실패하기 때문입니다.

그럼 링크 클릭 시 페이지 이동 대신 기능 액티비티를 표시하도록 수정해보니다.

파이어몽키 안드로이드 웹브라우저 소스 수정

위 링크 이슈를 해결하기 위해서는 파이어몽키 안드로이드 웹브라우저의 소스(FMX.WebBrowser.Android.pas)를 수정 해야합니다.(아래 과정은 델파이 XE8 기준으로 설명합니다. 다른 버전은 소스의 경로와 소스코드 내용 중 일부가 다를 수 있습니다.)

1, 안드로이드 소스코드 복사

아래 경로에서 안드로이드 웹브라우저 소스(FMX.WebBrowser.Android.pas)파일 복사합니다.

  • C:\Program Files (x86)\Embarcadero\Studio\16.0\source\fmx\FMX.WebBrowser.Android.pas (XE8 기준)
위 파일을 델파이 프로젝트 파일(*.dproj)과 같은 경로에 붙여넜습니다.

프로젝트 경로에 파일을 복사한 이유는 델파이 컴파일러는 프로젝트 파일의 경로의 소스파일을 우선적으로 참고해 컴파일합니다. 위 특징을 이용해 프레임워크 소스코드를 프로젝트 파일과 같은 경로에 놓고 수정하면 수정된 내용이 적용되어 컴파일 됩니다.


2, 파이어몽키 소스코드 수정

위에서 복사한 소스코드를 델파이 IDE > File > Open 메뉴로 엽니다.
그리고, shouldOverrideUrlLoading 메소드 구현부를 수정하겠습니다.

shouldOverrideUrlLoading 메소드는 웹뷰의 URL 변경 시 발생되며, URL에 따라 호스트 애플리케이션이 제어할 수 있는 기회를 주는 이벤트입니다.(안드로이드 기술문서: shouldOverrideUrlLoading)

리턴 값이 True이면 호스트가 제어하기 때문에 화면을 이동하지 않고, False이면 화면을 이동합니다.

다음 코드를 참고해 shouldOverrideUrlLoading 메소드 구현부를 수정합니다.

function TAndroidWebBrowserService.TWebBrowserListener.shouldOverrideUrlLoading(
  P1: JWebView; P2: JString): Boolean;
var
  Url: string;
  Intent: JIntent;
begin
  Url := JStringToString(P2);

  FWBService.ShouldStartLoading(Url);
  Result := False;

  // 리턴값이 True이면 페이지를 랜더링하지 않음
    // http 또는 https 인 경우 False(랜더링 함)
    // 그 외 True(렌더링 안함)  로딩을 중지 함(P1.stopLoading)
  if (Url.StartsWith('http://') or Url.StartsWith('https://')) then
    Result := False
  else
  begin
    // tel:, sms:, mailto:, geo: 등은 해당 Activity 실행
    Intent := TJIntent.JavaClass.init(TJIntent.JavaClass.ACTION_VIEW,
      TJnet_Uri.JavaClass.parse(P2));
    try
      SharedActivity.startActivity(Intent);
      Result := True;
    except
    end;
  end;

  // 렌더링 안하므로 로딩 중지
  if Result then
    P1.stopLoading;
end;

3, 테스트

위와 같이 수정하고 빌드 후 전화번호 링크를 클릭하면 아래와 같이 관련된 기능이 동작합니다.


참고 글



저작자 표시 비영리 동일 조건 변경 허락
신고

험프리.김현수 파이어몽키

개발환경 설정 - 안드로이드 개발환경

2015.06.09 11:32

안드로이드 개발환경 설정

RAD Studio를 기본 설정으로 설치하면 안드로이드 앱을 개발할 수 있는 안드로이드 관련 소프트웨어(SDK, NDK, JDK 등)가 기본 설치됩니다.


1, 안드로이드 도구 설치확인하기

Android Tools 설치 확인

윈도우 시작 메뉴(시작버튼 > 앱 보기 > Embarcadero RAD Studio [버전])에서 Android Tools 항목을 확인합니다.


Android Tools 설치(설치하지 않은 경우)

만약, Android Tools 항목이 보이지 않는다면 Modify, Repair, Unistall 메뉴를 선택하고, 다음 화면에서 Android SDK와 Android NDK를 다시 설치하기 바랍니다.


2, 실제 디바이스 연결하기

개발PC와 디바이스 연결

개발 PC와 안드로이드 디바이스를 USB 케이블로 연결합니다. 개발 PC에는 안드로이드 디바이스를 인식하기 위한 USB 드라이버가 설치되어 있어야 합니다.
USB 드라이버 설치가 잘 되어 있다면 아래와 같이 탐색기에 디바이스 목록이 장치 관리자에 Android Phone 목록이 표시됩니다.


USB 드라이버 설치(USB 드라이버가 설치되어 있지 않은 경우)

만약, USB 드라이버가 설치되지 않은 경우 각 디바이스 제조사의 웹사이트를 통해 USB 드라이버 설치파일을 다운로드 받아 설치해야 합니다.


USB 디버깅 설정

개발 PC와 안드로이드 디바이스가 연결되어 있어도, 디바이스에서 USB 디버깅을 사용하도록 설정해야 앱을 배포하고 디버깅할  수 있습니다.

안드로이드 디바이스의 환경설정 > 개발자 옵션 > USB 디버깅 항목을 체크(선택) 합니다.


만약, 개발자 옵션 메뉴가 표시되지 않는다면 "환경설정 > 디바이스 정보 > 빌드 번호" 메뉴를 7회 터치하면 개발자 옵션 메뉴가 표시됩니다.(인드로이드 4.2 이상에서는 개발자 옵션이 기본적으로 감춰져 있습니다.)


USB 디버깅 허용

개발 PC와 장치 연결 시 "USB 디버깅을 허용할까요?" 메시지가 표시되면 허용해야합니다.

3, RAD Studio와 연결 확인하기

앞의 과정을 진행하면 개발PC와 디바이스 연결이 완료되었습니다. 이제 RAD Studio를 열고, File > New > Multi-Deivce Application 메뉴로 새로운 프로젝트를 만듭니다.

우측의 프로젝트 매니저에서 Target Platforms > Android > Target 트리메뉴를 확장하면 아래 그림과 같이 개발 PC와 연결된 디바이스 목록이 표시됩니다.


관련 글



저작자 표시 비영리 동일 조건 변경 허락
신고

험프리.김현수 파이어몽키

앱의 상태바(StatusBar) 제어하기(색상변경, 감추기, 투명하게)

2015.06.04 11:08

iOS 상태바 제어하기

iOS 앱의 상태바 색상을 변경하고, 감추고, 투명하게 할 수 있습니다.

1, 상태바 색상 변경하기

상태바 색상은 폼의 색상(Fill.Color)을 그대로 반영합니다.

  • 폼의 Fill.Color 변경
  • 폼의 Fill.Kind = Solid

2, 전체화면 전환(상태바 감추기)

폼의 테두리를 표시하지 않으면 상태바도 표시되지 않습니다.

  • 폼의 BorderStyle = None
참고로 코드로 BorderStyle을 변경 시 메모리 참조 에러가 간혹 발생합니다. 만약, 코드로 전체화면으로 전환이 필요한 경우 아래글의 Under the hood – FullScreen & TPlatformServices 섹션을 참고하시기 바랍니다.

3, 상태바 투명하게 하기

상태바를 투명하게 하기 위해서는 파이어몽키 소스코드(FMX.Platform.iOS.pas)를 수정해야합니다.

다음 글을 세번째 항목(三、透明状态栏(能见底图))을 참고하시기 바랍니다.


중국인 개발자(龟山阿卍)의 블로그입니다. 


Tip> 파이어몽키  소스코드를 수정하기

1, RAD Studio 소스코드 경로에서 파이어몽키 소스코드를 복사합니다.(설치경로로\source)

2, 프로젝트 경로에 파이어몽키 소스코드를 붙여넣기 합니다.

3, 프로젝트 매니저에서 위의 파이어몽키 소스코드를 추가합니다.

4, 프로젝트의 파이어몽키 소스코드를 수정 후 컴파일 시 프로젝트의 소스코드를 참고해 빌드됩니다.

안드로이드 상태바 제어하기

안드로이드는 XE7부터 몰입(Immersive)모드를 지원합니다. 몰입모드는 Android KitKat(4.4) 이상에서 동작합니다.

전체화면(상태바 감추기)

폼의 FullScreen 속성을 이용해 전체화면으로 전환/해제 할 수 있습니다.

  • 폼의 FullScreen = True
FullScreen 진입해 전체화면이 되면 상/하단을 쓸어 시스템 메뉴를 표시할 수 있습니다.

참고 글




저작자 표시 비영리 동일 조건 변경 허락
신고

험프리.김현수 파이어몽키

[XE8] 스피드버튼의 이미지를 크게 표시할 수 있습니다.

2015.06.04 10:32

파이어몽키에 이미지리스트가 추가(XE8~)되어 스피드버튼에 이미지 표시가 아주 편리해졌습니다.


하지만, 이미지의 기본크기가 너무 작다고 느끼신 경우 다음 글을 통해 스타일을 수정해 큼지막한 이미지를 표시해 보세요.



중국인 개발자(龟山阿卍)의 블로그입니다. 


저작자 표시 비영리 동일 조건 변경 허락
신고

험프리.김현수 파이어몽키 Imagelist, Speedbutton, XE8

[JVESoft] 광고와 결재 컴포넌트(AdMob, Paypal 등)

2015.05.18 09:29

JVESoft는 각종 광고 플랫폼과 결재 플랫폼에 연결할 수 있는 컴포넌트를 제작해 판매하고 있습니다.


RAD Studio에서는 TBannerAd 컴포넌트로 광고기능TInAppPuchase 컴포넌트로 결재 기능을 지원하고 있습니다.

각 컴포넌트의 기능과 편의성을 검토해 보시고 원하는 컴포넌트를 선택해서 광고와 결재기능을 여러분의 앱에 추가하시기 바랍니다.




저작자 표시 비영리 동일 조건 변경 허락
신고

험프리.김현수 파이어몽키

[iOS] 배포파일 아이클라우드 백업 옵션설정하기

2015.05.18 09:15

iOS앱 배포 시 함께 배포하는 파일에 대해 아이클라우드 백업 설정하는 코드입니다.

대상은 "StartUp\Documents"에 배포하는 파일이며, 아이클라우드 백업 설정하지 않으면 앱스토어 배포 시 리젝처리 될수 있다고 하니 아래 코드를 참고해서 아이클라우드 백업 설정처리하시기 바랍니다.

uses iOSapi.Foundation;
 
function SetBackupFlag( AFileName: string; ABackup: boolean): boolean;
var
  URL : NSUrl;
  Err : PPointer;
begin
  URL := TNSURL.Wrap(TNSURL.OCClass.fileURLWithPath(NSStr(AFileName)));
  Result := URL.setResourceValue(TNSNumber.OCClass.numberWithBool(not ABackup),
              NSStr ('NSURLIsExcludedFromBackupKey'), err) and (err = nil);
end;



참고 글



저작자 표시 비영리 동일 조건 변경 허락
신고

험프리.김현수 파이어몽키

파이어몽키에서 외부 라이브러리 연동하기(jar, so, a)

2015.04.14 09:58

안드로이드 라이브러리 연동하기

JAR 라이브러리 연동하기

안드로이드 커스텀 라이브러리 연동하는 방법은 엠바카데로 기술문서를 통해 확인할 수 있습니다.

위 페이지에서 제공하는 링크를 따라가며 상세 내용을 익히시기 바랍니다.

libXXX.so 라이브러리 연동하기

엠바카데로 팀 제팬 블로그(http://blogs.embarcadero.com/teamj/)의 글을 링크합니다.

아래 글에서 이클립스로 so 라이브러리를 만들고 델파이에서 dlopen 함수를 이용해 로드해 오는 내용을 참고할 수 있습니다.

(델파이 XE5에서 작성된 글이지만 사용방식은 최신버전에서도 동일합니다.)

iOS 라이브러리 연동하기

정적 라이브러리(*.a) 연동하기

iOS에서는 동적 라이브러리(*.dylib)를 사용하면 앱을 앱스토어에 등록 시 거절 사유가 되기 때문에 정적 라이브러리(*.a)만 사용 가능합니다.


iOS에서 정적 라이브러리 연동하는 방법은 최원식옹(http://blog.naver.com/simonsayz)님의 블로그 글을 링크합니다.

(델파이 XE4에서 작성된 글이지만 사용방식은 최신버전에서도 동일합니다.)

    델파이(파이어몽키)에서 Objective-C 라이브러리를 사용하기 위한 로더를 만드는 내용을 샘플로 소개합니다.

    델파이(파이어몽키)에서 Objective-C 라이브러리와 컨트롤 연동하는 방법을 샘플로 소개합니다.

      실무에서 사용하는 라이브러리(ZBar)를 델파이에서 연동하는 내용을 샘플을 통해 소개합니다.



      저작자 표시 비영리 동일 조건 변경 허락
      신고

      험프리.김현수 파이어몽키

      1. Blog Icon
        윤수아

        이제 막 XE7으로 안드로이드 개발을 시작하려고 하는데
        안드로이드 SDK, JAVA, 브릿지파일, 자바임포트, Java2OP
        이런 개념들이 뒤죽박죽 섞여서 개념 잡기가 힘이 드네요..

        그러다가 아래와 같은 컴포넌트 판매 페이지를 보게 되었는데...
        저 둘의 구분이 뭔지도 모르겠고.. JAVA2OP.exe 가 저 역활 아닌가.. 하면서 다시 혼란스럽네요..
        http://www.winsoft.sk/jbridge.htm
        http://www.winsoft.sk/jimport.htm

      2. Blog Icon
        김윤태

        위 주제에 반대로 하고 싶은데요. 파이어몽키에서 정적 또는 동적 라이브러리를 만들어서 외부 프로그램 (XCode, JAVA)에 연동하는 것은 어떻게 되는지 궁금합니다. 인터넷에서 찾아 봤는데 자료가 없더군요. 꼭 답변 부탁드립니다. ^^

      3. 델파이에서 아직 파이어몽키 라이브러리 개발을 지원하지 않습니다.

      [FMX] ListBox 전체체크 기능 구현하기

      2015.03.04 13:28

      리스트박스(TListBox)에 체크박스를 두고 버튼 클릭 시 전체체크하는 기능에 대한 문의가 있어 정리해 봤습니다.


      이 글에서는 아래 내용을 학습할 수 있습니다.

      • 리스트박스를 동적으로 생성하는 방법
      • 리스트박스 아이템에 체크박스를 표시하는 속성

      화면 구성

      컴포넌트 속성 설정

      주요 속성을 설정합니다.(Object Inspector에서 속성을 설정해도 됩니다.)

      procedure TForm2.FormCreate(Sender: TObject);
      begin
        Button1.StaysPressed := True; //버튼 눌림(IsPressed) 상태 유지
      
        ListBox1.DefaultItemStyles.ItemStyle := 'listboxitemrightdetail'; // 텍스트와 오른쪽에 상세정보가 표시되도록 기본속성 지정
        ListBox1.ShowCheckboxes := True; // 리스트박스 항목에 체크박스가 표시되도록 설정
      end;

      새로고침

      procedure TForm2.Button2Click(Sender: TObject);
      var
        I: Integer;
        Item: TListBoxItem;
      begin
        ListBox1.Items.Clear;
        ListBox1.BeginUpdate;
        try
          for I := 0 to 10 do
          begin
            Item := TListBoxItem.Create(ListBox1);
            Item.Parent := ListBox1;
            Item.Text := 'Item ' + I.ToString;
            Item.ItemData.Detail := 'Description';
          end;
        finally
          ListBox1.EndUpdate;
        end;
      end;

      전체선택

      procedure TForm2.Button1Click(Sender: TObject);
      var
        I, Idx: Integer;
      begin
        Idx := ListBox1.ItemIndex;
        ListBox1.BeginUpdate;
        try
          for I := 0 to ListBox1.Items.Count - 1 do
          begin
            ListBox1.ListItems[I].IsChecked := Button1.IsPressed;
          end;
        finally
          ListBox1.EndUpdate;
          ListBox1.ItemIndex := Idx;
        end;
      end;

      소스코드

      ProjectLBCheck.zip


      Tips>

      커스텀 스타일로 TListBoxItem 스타일을 만드는 경우 TCheckBox의 StyleName을 "check"로 지정하기 바랍니다.


      저작자 표시 비영리 동일 조건 변경 허락
      신고

      험프리.김현수 파이어몽키

      [XE7] iOS 시뮬레이터 배포 시 'Please specify exact device preset UUID.' 오류 대응

      2015.02.24 17:48

      iOS 시뮬레이터 실행 시 아래와 같은 오류 발생 시 대처사항입니다.



      결과적으로 원인은 RAD Studio XE7에서 iOS Simulator 8.1을 지원하지 않아서 입니다.

      (iOS Device에서는 8.1을 지원합니다.)

      Hotfix iPhone Simulator 7.1 지원

      RAD Studio XE7 출시 이후 나온 7.1에 대한 패치가 필요합니다. 아래 글의 2번째 Hotfix 설치하기 바랍니다.

      iPhone Simulator 7.1 설치 및 설정

      1. 맥에서 XCode(6.1) 실행 > XCode > Preferences... > Download 화면에서 iOS 7.1 Simulator 다운로드
      2. 델파이 Project Manager의 iOS Simulator에서 Property > SDK에서 iPhoneSimulator 7.1 선택(없으면 Add new... 선택)
      3. (PAServer가 연결된 상태에서)자동으로 iPhoneSimulator 7.1 관련 라이브러리 생성(만약 동작하지 않으면 PAServer 재시작)
      4. iOS Simulator로 다시 배포 및 테스트


      저작자 표시 비영리 동일 조건 변경 허락
      신고

      험프리.김현수 파이어몽키

      파이어몽키 용 그리드 컴포넌트 안내 - FirePower

      2015.02.23 13:24

      태블릿용 앱에서는 한 화면에 많은 정보(여러 컬럼과 레코드)를 표시해야하는 경우가 있는데요.

      이때, 기본 컴포넌트를 이용한다면 리스트뷰에 컬럼을 추가해 구현할 수 있지만, 아무래도 전통적인 그리드 컴포넌트가 필요할 수 있습니다.


      오늘은 이미 인포파워 그리드로 유명한 Woll2Woll사의 파이어몽키용 그리드 컴포넌트인 FirePower 컴포넌트를 소개합니다.


      제가 트라이얼로 돌려본 주요 기능은 아래와 같습니다.

      • 기본 그리드 컴포넌트(TGrid, TStringGrid) 대비 스크롤 속도가 상당히 빠릅니다.(이 부분은 기본 컴포넌트의 성능도 꾸준히 개선되고 있습니다.)
      • 다양한 스타일(배경색상, 글자색, 글자 스타일 등)을 적용할 수 있습니다.
      • 셀에 버튼, 이미지 등 속성을 지정할 수 있습니다.
      • 컬럼별 색상을 지정할 수 있습니다.
      • 컬럼별 정렬이 가능합니다.

      그 외의 기능들은 제품소개 또는 트라이얼로 테스트 할 수 있습니다.

      엠바카데로 테크니컬 파트너 페이지에도 등록되어 있습니다.(최신버전을 지원하는 다른 컴포넌트도 알아보시기 바랍니다.)


      참고 링크



      관련 글


      저작자 표시 비영리 동일 조건 변경 허락
      신고

      험프리.김현수 파이어몽키 XE7, 그리드

      [XE7] 안드로이드 블루투스 활성화 조회와 설정하기

      2015.02.12 09:39

      일본인 개발자인 山本隆(야마모토 타카시)의 글을 참고해 안드로이드에서 블루투스 활성여부 조회와 설정하는 내용을 공유합니다.

      블루투스 활성여부 조회

      uses
        Androidapi.JNI.Bluetooth;
      
      procedure TForm2.Button1Click(Sender: TObject);
      var
        Adapter: JBluetoothAdapter;
      begin
        Adapter := TJBluetoothAdapter.JavaClass.getDefaultAdapter;
        if Adapter.isEnabled then
          ShowMessage('Bluetooth가 활성화 되어있습니다.')
        else
          ShowMessage('Bluetooth가 활성화 되지 않았습니다.');
      end;

      블루투스 활성화 설정

      uses
        Androidapi.JNI.Bluetooth;
      
      procedure TForm2.Button2Click(Sender: TObject);
      var
        Adapter: JBluetoothAdapter;
      begin
        Adapter := TJBluetoothAdapter.JavaClass.getDefaultAdapter;
        if Adapter.enable then
          ShowMessage('Bluetooth를 활성화합니다.')
        else
          ShowMessage('사용할 수 없습니다.');
      end;
      
      procedure TForm1.Button3Click(Sender: TObject);
      var
        Adapter: JBluetoothAdapter;
      begin
        Adapter := TJBluetoothAdapter.JavaClass.getDefaultAdapter;
        if Adapter.disable then
          ShowMessage('Bluetooth를 비활성화합니다.')
        else
          ShowMessage('사용할 수 없습니다.');
      end;

      블루투스 권한이 있는지 확인

      uses
        Androidapi.Helpers,
        Androidapi.JNI.GraphicsContentViewText;
      
      procedure TForm2.Button3Click(Sender: TObject);
        function HasPermission(const Permission: string): Boolean;
        begin
          Result := SharedActivityContext.checkCallingOrSelfPermission(StringToJString(Permission)) = TJPackageManager.JavaClass.PERMISSION_GRANTED
        end;
      
      begin
        if HasPermission('android.permission.BLUETOOTH') then
          ShowMessage('Bluetooth 통신 권한이 있습니다.')
        else
          ShowMessage('Bluetooth 통신 권한이 없습니다');
      
        if HasPermission('android.permission.BLUETOOTH_ADMIN') then
          ShowMessage('Bluetooth 설정 수정 권한이 있습니다.')
        else
          ShowMessage('Bluetooth 설정 수정 권한이 없습니다.');
      end;

      • 블루투스 관련 권한(Project Options > Uses Permissions)이 필요합니다.
        • Bluetooth
        • Bluetooth admin

      샘플프로그램 다운로드

      ProjectSetBluetooth.zip

      참고 글


      저작자 표시 비영리 동일 조건 변경 허락
      신고

      험프리.김현수 파이어몽키 XE7, 블루투스, 안드로이드

      [XE7] 안드로이드 WiFi 상태조회와 설정하기

      2015.02.11 10:44

      일본인 개발자인 山本隆(야마모토 타카시)의 글을 참고해 안드로이드 앱에서 Wifi 상태를 읽고 키고끄는 기능을 구현해 보고 공유합니다.

      ❑ 안드로이드 WifiManager 델파이 브릿지 파일 생성

      Java2OP 툴을 이용해 WifiManager 델파이 브릿지 파일을 만듭니다.

      Java2OP.exe -classes android.net.wifi.WifiManager -unit Androidapi.JNI.WifiManager


      위 명령어를 실행하면 아래와 같이 Androidapi.JNI.WifiManager.pas 유닛파일이 생성됩니다. 



      해당 유닛파일을 프로젝트 경로 또는 본인이 관리하는 라이브러리 경로에 복사합니다.(저는 D:\Projects\common\rtl\XE7\android 경로에 복사 후 Option > Library Path에 경로를 등록했습니다.)


      만약, 아래와 같은 "Missing JDK. Please install JDK 1.7+ or make sure that it is in your PATH" 메시지가 표시된다면


       커맨드라인에서 아래의 명령어를 이용해 환경변수에 추가 후 다시 시도하기 바랍니다.(도움말)
      SET PATH=%PATH%;C:\Program Files\Java\jdk1.7.0_25\bin


      ❑ Androidapi.JNI.WifiManager 유닛을 이용해 WiFI 제어기능 구현

      새로운 프로젝트를 생성하고, 위에서 생성한 Androidapi.JNI.WifiManager를 추가합니다.

      uses 절에 구현에 필요한 유닛을 추가합니다.

      uses
        Androidapi.Helpers,
        Androidapi.JNI.JavaTypes,
        Androidapi.JNI.GraphicsContentViewText,
        Androidapi.JNIBridge,
        Androidapi.JNI.WifiManager;

      WiFi 설정(키고 끄기)하기

      procedure SetWifiEnabled(AEnable: Boolean);
      var
        Obj: JObject;
        WifiManager: JWifiManager;
      begin
        Obj := SharedActivityContext.getSystemService(TJContext.JavaClass.WIFI_SERVICE);
        if Obj = nil then
          Exit;
      
        WifiManager := TJWifiManager.Wrap((Obj as ILocalObject).GetObjectID);
        WifiManager.setWifiEnabled(AEnable);
      end;

      WiFi 상태 조회

      function IsWifiEnabled: Boolean;
      var
        Obj: JObject;
        WifiManager: JWifiManager;
      begin
        Obj := SharedActivityContext.getSystemService(TJContext.JavaClass.WIFI_SERVICE);
        if Obj = nil then
          Exit;
      
        WifiManager := TJWifiManager.Wrap((Obj as ILocalObject).GetObjectID);
        Result := WifiManager.isWifiEnabled;
      end;

      ❑ 사용자 권한 설정

      위 Wifi 제어와 상태조회 기능을 사용할 경우 사용자 권한을 추가해야 합니다.

      Project Option > Uses permissions

      • Access wifi state : Wifi 상태 조회

      • Change wifi state : Wifi 상태 설정

      ❑ 최종 화면과 소스코드


      참고 글



      저작자 표시 비영리 동일 조건 변경 허락
      신고

      험프리.김현수 파이어몽키

      태블릿용 멀티컬럼 리스트뷰 ItemAppearace 만들기

      2015.02.09 11:28

      모바일(폰과 패드)용 목록을 만드는 컴포넌트는 대표적으로 ListView와 ListBox가 있습니다.

      두 목록 컴포넌트의 차이점은 이름으로 알수 있듯이 목적에 차이가 있습니다.


      ListView는 

      View 즉 보여주는 것을 목적으로 하기 때문에 목록을 빠르게 이동할 수 있지만 목록아이템을 꾸미는데 제한적입니다.

      반면, 

      ListBox는 

      Box 즉 목록 아이템에 다른 아이템을 담아 자유롭게 목록을 구성할 수 있는 컴포넌트입니다. 목록을 원하는데로 꾸밀 수 있지만 많은 컴포넌트를 담는다면 스크롤이 상대적으로 느려질 수 있습니다.


      두 목록 컴포넌트의 목적을 잘 이해하고 사용하시기 바랍니다.


      ListView는 목록 아이템을 꾸미는데 제한적이라고 했는데요. 그 이유는 TListViewItem은 (TFMXObject를 상속받지 않았기 때문에)다른 컴포넌트를 올릴 수 없도록 설계되었습니다. 아이템 외관을 꾸미기 위해서는 ListView의 ItemAppearance 속성을 이용할 수 있습니다. 이 속성은 기본으로 7개의 항목만 제공됩니다.

      기본 제공되는 ItemAppearance는 모바일 폰(작은화면)을 기준으로 제공합니다. 태블릿용 앱에서는 화면이 다소 허전해 질 수 있습니다.

      이렇게 기본 제공되는 외관을 변경(항목 추가, 위치 이동)하기 위해서는 ItemAppearance 패키지 프로젝트를 직접 만들어 설치(Install) 후 사용할 수 있습니다.

      ItemAppearance 패키지 제작

      기본 샘플 참고

      델파이 기본 샘플에서 ListView 샘플(Samples\Object Pascal\Mobile Samples\User Interface\ListView)을 참고할 수 있습니다.

      ListView 샘플에는 상세정보를 여러건 보여주는 MultiDetailItem, 별점을 표시하는 RatingItem 등의 목록을 구성할 수 있는 패키지 프로젝트(*.dpk)가 있고, 그 패키지를 사용하는 샘플 프로젝트가 있습니다.

      먼저 패키지 프로젝트를 열고 프로젝트 매니저에서 설치(오른쪽 마우스 > Install) 후 샘플 프로젝트를 열어 확인하기 바랍니다.

      패키지 프로젝트를 열면 ItemAppearance 속성에 새로운 항목이 추가된 것을 볼 수 있습니다.

      MultiDetailHorzItem

      제가 직접 4개의 열을 갖는 ItemAppearance를 만들어 테스트 해 봤습니다. 기본 제공되는 MultiDetailItem을 수정했습니다.

      확실히 ListBox, Grid, StringGrid에 비해 목록을 스크롤하는 속도가 빠릅니다.


      unit MultiDetailHorzAppearanceU;
      
      interface
      
      uses FMX.ListView, FMX.ListView.Types, System.Classes, System.SysUtils,
      FMX.Types, System.UITypes, FMX.MobilePreview;
      
      type
      
        TMultiDetailHorzAppearanceNames = class
        public const
          ListItem = 'MultiDetailHorzItem';
          ListItemCheck = ListItem + 'ShowCheck';
          ListItemDelete = ListItem + 'Delete';
          Detail1 = 'det1';  // Name of MultiDetail object/data
          Detail2 = 'det2';
          Detail3 = 'det3';
        end;
      
      implementation
      
      uses System.Math, System.Rtti;
      
      type
      
        TMultiDetailHorzItemAppearance = class(TPresetItemObjects)
        public const
          cTextMarginAccessory = 8;
          cDefaultHeight = 40;
        private
          FMultiDetail1: TTextObjectAppearance;
          FMultiDetail2: TTextObjectAppearance;
          FMultiDetail3: TTextObjectAppearance;
          procedure SetMultiDetail1(const Value: TTextObjectAppearance);
          procedure SetMultiDetail2(const Value: TTextObjectAppearance);
          procedure SetMultiDetail3(const Value: TTextObjectAppearance);
        protected
          function DefaultHeight: Integer; override;
          procedure UpdateSizes; override;
          function GetGroupClass: TPresetItemObjects.TGroupClass; override;
          procedure SetObjectData(const AListViewItem: TListViewItem; const AIndex: string; const AValue: TValue; var AHandled: Boolean); override;
        public
          constructor Create; override;
          destructor Destroy; override;
        published
          property MultiDetail1: TTextObjectAppearance read FMultiDetail1 write SetMultiDetail1;
          property MultiDetail2: TTextObjectAppearance read FMultiDetail2 write SetMultiDetail2;
          property MultiDetail3: TTextObjectAppearance read FMultiDetail3 write SetMultiDetail3;
          property Accessory;
        end;
      
        TMultiDetailHorzDeleteAppearance = class(TMultiDetailHorzItemAppearance)
        private const
          cDefaultGlyph = TGlyphButtonType.Delete;
        public
          constructor Create; override;
        published
          property GlyphButton;
        end;
      
        TMultiDetailShowCheckAppearance = class(TMultiDetailHorzItemAppearance)
        private const
          cDefaultGlyph = TGlyphButtonType.Checkbox;
        public
          constructor Create; override;
        published
          property GlyphButton;
        end;
      
      const
        cMultiDetail1Member = 'Detail1';
        cMultiDetail2Member = 'Detail2';
        cMultiDetail3Member = 'Detail3';
      
      constructor TMultiDetailHorzItemAppearance.Create;
      begin
        inherited;
        Accessory.DefaultValues.AccessoryType := TAccessoryType.More;
        Accessory.DefaultValues.Visible := True;
        Accessory.RestoreDefaults;
        Text.DefaultValues.VertAlign := TListItemAlign.Trailing;
        Text.DefaultValues.TextVertAlign := TTextAlign.Center;
        Text.DefaultValues.Visible := True;
        Text.RestoreDefaults;
      
        FMultiDetail1 := TTextObjectAppearance.Create;
        FMultiDetail1.Name := TMultiDetailHorzAppearanceNames.Detail1;
        FMultiDetail1.DefaultValues.Assign(Text.DefaultValues);  // Start with same defaults as Text object
        FMultiDetail1.DefaultValues.IsDetailText := True; // Use detail font
        FMultiDetail1.VertAlign := TListItemAlign.Leading;
        FMultiDetail1.Align := TListItemAlign.Trailing;
        FMultiDetail1.TextVertAlign := TTextAlign.Center;
        FMultiDetail1.RestoreDefaults;
        FMultiDetail1.OnChange := Self.ItemPropertyChange;
        FMultiDetail1.Owner := Self;
      
        FMultiDetail2 := TTextObjectAppearance.Create;
        FMultiDetail2.Name := TMultiDetailHorzAppearanceNames.Detail2;
        FMultiDetail2.DefaultValues.Assign(FMultiDetail1.DefaultValues);  // Start with same defaults as Text object
        FMultiDetail2.VertAlign := TListItemAlign.Leading;
        FMultiDetail2.Align := TListItemAlign.Trailing;
        FMultiDetail2.TextVertAlign := TTextAlign.Center;
        FMultiDetail2.RestoreDefaults;
        FMultiDetail2.OnChange := Self.ItemPropertyChange;
        FMultiDetail2.Owner := Self;
      
        FMultiDetail3 := TTextObjectAppearance.Create;
        FMultiDetail3.Name := TMultiDetailHorzAppearanceNames.Detail3;
        FMultiDetail3.DefaultValues.Assign(FMultiDetail2.DefaultValues);  // Start with same defaults as Text object
      //  FMultiDetail3.DefaultValues.Height := 20; // Move text down
        FMultiDetail3.VertAlign := TListItemAlign.Leading;
        FMultiDetail3.Align := TListItemAlign.Trailing;
        FMultiDetail3.TextVertAlign := TTextAlign.Center;
        FMultiDetail3.RestoreDefaults;
        FMultiDetail3.OnChange := Self.ItemPropertyChange;
        FMultiDetail3.Owner := Self;
      
        // Define livebindings members that make up MultiDetail
        FMultiDetail1.DataMembers :=
          TObjectAppearance.TDataMembers.Create(
            TObjectAppearance.TDataMember.Create(
              cMultiDetail1Member, // Displayed by LiveBindings
              Format('Data["%s"]', [TMultiDetailHorzAppearanceNames.Detail1])));   // Expression to access value from TListViewItem
        FMultiDetail2.DataMembers :=
          TObjectAppearance.TDataMembers.Create(
            TObjectAppearance.TDataMember.Create(
              cMultiDetail2Member, // Displayed by LiveBindings
              Format('Data["%s"]', [TMultiDetailHorzAppearanceNames.Detail2])));   // Expression to access value from TListViewItem
        FMultiDetail3.DataMembers :=
          TObjectAppearance.TDataMembers.Create(
            TObjectAppearance.TDataMember.Create(
              cMultiDetail3Member, // Displayed by LiveBindings
              Format('Data["%s"]', [TMultiDetailHorzAppearanceNames.Detail3])));   // Expression to access value from TListViewItem
      
        GlyphButton.DefaultValues.VertAlign := TListItemAlign.Center;
        GlyphButton.RestoreDefaults;
      
        // Define the appearance objects
        AddObject(Text, True);
        AddObject(MultiDetail1, True);
        AddObject(MultiDetail2, True);
        AddObject(MultiDetail3, True);
        AddObject(Image, True);
        AddObject(Accessory, True);
        AddObject(GlyphButton, IsItemEdit);  // GlyphButton is only visible when in edit mode
      end;
      
      constructor TMultiDetailHorzDeleteAppearance.Create;
      begin
        inherited;
        GlyphButton.DefaultValues.ButtonType := cDefaultGlyph;
        GlyphButton.DefaultValues.Visible := True;
        GlyphButton.RestoreDefaults;
      end;
      
      constructor TMultiDetailShowCheckAppearance.Create;
      begin
        inherited;
        GlyphButton.DefaultValues.ButtonType := cDefaultGlyph;
        GlyphButton.DefaultValues.Visible := True;
        GlyphButton.RestoreDefaults;
      end;
      
      function TMultiDetailHorzItemAppearance.DefaultHeight: Integer;
      begin
        Result := cDefaultHeight;
      end;
      
      destructor TMultiDetailHorzItemAppearance.Destroy;
      begin
        FMultiDetail1.Free;
        FMultiDetail2.Free;
        FMultiDetail3.Free;
        inherited;
      end;
      
      procedure TMultiDetailHorzItemAppearance.SetMultiDetail1(
        const Value: TTextObjectAppearance);
      begin
        FMultiDetail1.Assign(Value);
      end;
      
      procedure TMultiDetailHorzItemAppearance.SetMultiDetail2(
        const Value: TTextObjectAppearance);
      begin
        FMultiDetail2.Assign(Value);
      end;
      
      procedure TMultiDetailHorzItemAppearance.SetMultiDetail3(
        const Value: TTextObjectAppearance);
      begin
        FMultiDetail3.Assign(Value);
      end;
      
      procedure TMultiDetailHorzItemAppearance.SetObjectData(
        const AListViewItem: TListViewItem; const AIndex: string;
        const AValue: TValue; var AHandled: Boolean);
      begin
        inherited;
      
      end;
      
      function TMultiDetailHorzItemAppearance.GetGroupClass: TPresetItemObjects.TGroupClass;
      begin
        Result := TMultiDetailHorzItemAppearance;
      end;
      
      procedure TMultiDetailHorzItemAppearance.UpdateSizes;
      const
          // Total Rate = 1.0
          TextWidthRate = 0.4;
          Det1WidthRate = 0.2;
          Det2WidthRate = 0.2;
          Det3WidthRate = 0.2;
      
      var
        LOuterHeight: Single;
        LOuterWidth: Single;
        LInternalWidth: Single;
        LImagePlaceOffset: Single;
        LImageTextPlaceOffset: Single;
      begin
        BeginUpdate;
        try
          inherited;
      
          // Update the widths and positions of renderening objects within a TListViewItem
          LOuterHeight := Height - Owner.ItemSpaces.Top - Owner.ItemSpaces.Bottom;
          LOuterWidth := Owner.Width - Owner.ItemSpaces.Left - Owner.ItemSpaces.Right;
          Text.InternalPlaceOffset.X :=
            Image.ActualPlaceOffset.X +  Image.ActualWidth + LImageTextPlaceOffset;
      
          LInternalWidth := (LOuterWidth - Text.ActualPlaceOffset.X - Accessory.ActualWidth);
          if Accessory.ActualWidth > 0 then
            LInternalWidth := LInternalWidth - cTextMarginAccessory;
          Text.InternalWidth := Max(1, LInternalWidth * TextWidthRate);
      
          MultiDetail1.InternalWidth := LInternalWidth * Det1WidthRate;
          MultiDetail1.InternalPlaceOffset.X := Text.InternalPlaceOffset.X + Text.InternalWidth;
          MultiDetail2.InternalWidth := LInternalWidth * Det2WidthRate;
          MultiDetail2.InternalPlaceOffset.X := MultiDetail1.InternalPlaceOffset.X + MultiDetail1.InternalWidth;
          MultiDetail3.InternalWidth := LInternalWidth * Det3WidthRate;
          MultiDetail3.InternalPlaceOffset.X := MultiDetail2.InternalPlaceOffset.X + MultiDetail2.InternalWidth;
        finally
          EndUpdate;
        end;
      end;
      
      type
        TOption = TCustomListView.TRegisterAppearanceOption;
      const
        sThisUnit = 'MultiDetailHorzAppearanceU';     // Will be added to the uses list when appearance is used
      initialization
        // MultiDetailItem group
        TCustomListView.RegisterAppearance(
          TMultiDetailHorzItemAppearance, TMultiDetailHorzAppearanceNames.ListItem,
          [TOption.Item], sThisUnit);
        TCustomListView.RegisterAppearance(
          TMultiDetailHorzDeleteAppearance, TMultiDetailHorzAppearanceNames.ListItemDelete,
          [TOption.ItemEdit], sThisUnit);
        TCustomListView.RegisterAppearance(
          TMultiDetailShowCheckAppearance, TMultiDetailHorzAppearanceNames.ListItemCheck,
          [TOption.ItemEdit], sThisUnit);
      finalization
        TCustomListView.UnregisterAppearances(
          TArray.Create(
            TMultiDetailHorzItemAppearance, TMultiDetailHorzDeleteAppearance,
            TMultiDetailShowCheckAppearance));
      end.



      저작자 표시 비영리 동일 조건 변경 허락
      신고

      험프리.김현수 파이어몽키

      1. Blog Icon
        고재학

        소스 코드에 버그가 있는것 같네요.
        230 Text.InternalPlaceOffset.X :=
        231 Image.ActualPlaceOffset.X + Image.ActualWidth + LImageTextPlaceOffset;


      2. 어떤 증상이 있죠? 좀 더 자세히 알려주시면 감사하겠습니다.^^

      3. Blog Icon
        고재학

        윈도우에서 테스트할 경우에는 문제가 없었는데 모바일에서 컴파일하면 내용을 표시하는 과정에서 "Invalid floating point operation"가 나타납니다.
        위 코드를 제거하고 테스트해보니 정상작동 하였습니다.

      4. Blog Icon
        고재학

        질문에 답변도 해주시는지요?
        위의 예제를 응용하여 리스트뷰를 만들었는데... MultiDetail1에 대입되는 값에 따라 글자색을 변경하고 싶습니다.

        예를 들어
        MultiDetail1의 값이 1이면 MultiDetail1의 글자색은 빨강색
        MultiDetail1의 값이 2이면 MultiDetail1의 글자색은 파랑색

        모바일앱에서 MultiDetail1의 TextColor를 어떻게 동적으로 변경할 수 있을까요?

      5. C:\Users\Public\Documents\Embarcadero\Studio\17.0\Samples\Object Pascal\Multi-Device Samples\User Interface\ListView\ListViewMultiDetailAppearance

        위 ListView 샘플에 다음 코드로 진행해 봤습니다.(잘되네요^^)

        // ListView의 OnUpdateObjects 이벤트에 아래 코드 구현
        procedure TForm594.ListViewMultiDetailUpdateObjects(const Sender: TObject;
        const AItem: TListViewItem);
        var
        Textitem: TListItemText;
        begin
        Textitem := AItem.View.FindDrawable(TMultiDetailAppearanceNames.Detail1) as TListItemText;
        if Assigned(TextItem) then
        begin
        // M으로 시작하는 text 빨간색으로 표시
        if Textitem.Text.StartsWith('M') then
        begin
        TextItem.TextColor := $FFFF0000;
        end;
        end;
        end;

        위 디렉토리의 샘플을 참고하시면 다양한 기능을 구현할 수 있습니다.

      6. Blog Icon
        고재학

        와~~~ 멋지네요.
        XE8에서 작동하지않아 Seattle로 업그레이드하니 잘 됩니다.
        감사합니다.

      트루타입 폰트(FontAwesome) 파일을 이용해 아이콘 표시하기(안드로이드, iOS)

      2015.01.28 09:20

      트루타입 폰트에 그림을 등록해 아이콘으로 사용하는 방식은 최근 웹개발에서 많이 사용됩니다.

      델파이에서 어떻게 사용할까. 궁금했는데요. 마침 엠바카데로 커뮤니티 블로그에 관련 글이 올라와 소개합니다.



      간단한 개발팁을 보태면
      1. FontAwesome에서 다운로드 후 폰트파일 설치(fontawesome-webfont.ttf 찾아 더블클릭 > 설치)
      2. 윈도우 유틸리지 중 "문자표" 실행 후 FontAwesome 폰트 선택 후 사용할 아이콘 선택 > 클립보드 복사
      3. 델파이에서 Label 등을 추가 후 문자타입(Font.Family)를 "FontAwesome" 선택 후 값에 2번의 클립보드 내용 붙여넣기
      4. 안드로이드, iOS에 폰트파일 배포와 사용하도록 설정(원글 참고)

      관련 글


      저작자 표시 비영리 동일 조건 변경 허락
      신고

      험프리.김현수 파이어몽키

      [XE7] 안드로이드 L 스타일팩 다운로드

      2015.01.23 11:07

      최근 안드로이드 L(롤리팝: 5.0)을 적용한 스마트폰이 나오고 있습니다.


      엠바카데로에서도 안드로이드 5.0 지원을 위해 핫픽스를 배포하고 안드로이드 L에 맞는 스타일팩을 배포합니다.


      안드로이드 L 스타일팩 활용방법은 Sarina DuPont의 글을 참고하기 바랍니다.

      관련 글



      저작자 표시 비영리 동일 조건 변경 허락
      신고

      험프리.김현수 파이어몽키 XE7, 롤리팝, 스타일, 안드로이드, 안드로이드 L

      안드로이드에 설치된 앱 목록(AppList)을 표시하는 앱(소스코드 공개)

      2015.01.13 12:05

      안드로이드 디바이스에 설치된 앱을 빠르게 찾아 실행할 수 있는 안드로이드 앱의 소스코드를 FMXExpress.com에서 공개하였습니다.


      해당 앱은 설치된 앱 목록을 표시하고, 항목 선택 시 앱을 실행합니다. 그리고, 검색창을 통해 키워드로 필터링해 빠르게 앱을 검색할 수 있습니다. 기존에는 안드로이드 디바이스에서 페이지 단위로 넘겨가며(Swipe) 앱을 찾던 수고를 크게 줄일 수 있습니다.


      이 앱에서는 다음의 기술을 학습할 수 있습니다.

      • 설치된 앱 목록 조회하기
      • 설치된 앱의 아이콘 가져오기
      • 앱 실행(앱의 패키지명, 앱이름으로)
      • ListView 필터링 하기




      저작자 표시 비영리 동일 조건 변경 허락
      신고

      험프리.김현수 파이어몽키 oDesk, 안드로이드

      [XE7] 안드로이드 4.4 스타일의 대화상자 사용하기

      2015.01.07 10:04

      델파이를 이용해 안드로이드 앱개발 시 기본 대화상자(Dialog)는 안드로이드 2.3 버전으로 표시됩니다.

      이 이슈는 엠바카데로 커뮤니티 3.0 사이트에 등록되었으며 David I가 직접 답변을 달고 해결방안을 소개했습니다.


      결과 적으로 FMX.Helper.Android.pas 유닛의 GetNativeTheme 함수를 수정해 해결할 수 있습니다.

      (변경된 소스 적용은 프로젝트에 수정한 파일을 추가해서 간단히 해결할 수 있네요.)



      저작자 표시 비영리 동일 조건 변경 허락
      신고

      험프리.김현수 파이어몽키 XE7, 델파이, 안드로이드

      커스텀 폰트 배포와 사용하기(Android/iOS)

      2014.12.22 10:28

      커스텀 폰트를 배포하고 사용하는 방법을 안내하는 글이 있어 소개합니다.

      배포기능을 이용해 폰트를 배포하고 플랫폼 별로 배포된 폰트를 사용하도록 설정할 수 있습니다.

      (점점 다양한 종류의 아티클들이 나오고 있어 반갑네요^^)




      저작자 표시 비영리 동일 조건 변경 허락
      신고

      험프리.김현수 파이어몽키 Firemonkey, ios, 안드로이드