Amarengo

Articles and news

공유 확장 프로그램을 빌드하는 방법

원래 7 월 30 일에 스카티 피스터에 의해 게시 2016 24,887 읽기

참고:스위프트 4 업데이트.

직장에서 해킹 하루 동안 나는 공유 확장을 만드는 내 손을 시도하기로 결정했다. 나는 거기에 완벽한 기능을 갖춘 튜토리얼이 아니라는 것을 발견하고,그 결과로 나는(그것의 대부분은 애플 문서에,놀랍게도,기인)정보를 함께 조각했다.우리의 응용 프로그램에 풍부한 콘텐츠로 웹 페이지 주소를 저장하고,몇 가지 옵션의 구성을 허용 할 수있는 목표

. 처음에 나는 확장 작업이 필요한 무슨 생각-하지만 그(예:하나의 탭으로 사진에 적목 현상을 제거하는 등)콘텐츠를 수정하기위한 더 적합 보인다. 그것은 다른 사람,애플이 포함,대신 항목을 만들 수있는 공유 확장을 사용하는 것 같다.

이것은 우리가 끝까지 구축 한 것입니다:

완성 된 확장

당신이 볼 수 있듯이 나는 조금 디자인을 사용자 정의하고,시트의 맨 아래에있는 셀입니다”구성 항목”이라고 무엇을 추가했습니다;일반적으로 계정 또는 다른 옵션에서 선택하는 데 사용됩니다. 여기에 저장하려면 사용자의 기존”데크”에서 선택하는 데 사용됩니다. 당신이 볼 수없는 것은 또한 우리가 나중에 서버에 보내 브라우저의 현재 주소를 가져 오기 위해 몇 가지 자바 스크립트 코드를 실행하는 것입니다. 우리는 앞으로이 모든 것을 다룰 것입니다!

초기 단계

새 프로젝트를 만들거나 확장을 추가할 기존 프로젝트를 엽니다. 그런 다음 파일>새>대상을 누르십시오. 이오스 탭에서 공유 확장을 선택하고 다음을 누릅니다. 나는 간단한”공유 확장”을 선택했다.

구성표를 활성화할지 묻습니다. 이 응용 프로그램을 실행할 때 당신이 당신의 주요 응용 프로그램에 반대,확장을 테스트하기 위해 바로 사파리 또는 유사한으로 열 수 있다는 것을 의미합니다. 우리는 이것을 원합니다—탭 활성화.-언급 한 바와 같이 그것은 당신에게,사파리를 선택하고 실행을 누릅니다 테스트 할 수있는 응용 프로그램의 옵션을 제공합니다.

확장을 실행할 때 표시되는 대화 상자.

사파리가 열리면 공유 아이콘을 탭하면 자리 표시 자 아이콘이있는 확장자 이름이 목록에 나타납니다. 그렇지 않은 경우 더보기를 탭하고 활성화합니다. 아이콘을 탭하면 바로 상자 밖으로 꽤 깔끔한 컨트롤러의 기본 구현을 발표 할 예정이다.

주소 가져오기

공유 시트는 페이지 제목을 자동으로 검색하여 본문 텍스트로 설정합니다. 이를 위해 당신은 사파리 문서를 구문 분석하고 우리가 필요로하는 무엇이든 검색 할 수있는 자바 스크립트 파일을 실행 할 수 있습니다.

먼저,엑스 코드에서 확장 폴더를 마우스 오른쪽 버튼으로 클릭하고 새 파일을 선택합니다. 당신은 다른 탭의 내부 빈 찾을 수 있습니다,다음 히트 파일의 이름을”게털를.”…….”

확장 정보를 편집해야 합니다.이 사전은 단지 생성 된 파일의 값,”확장자”(확장의 부족을 참고)와 함께 키를 추가 할 수 있습니다.이 경우 사전 행을 추가 할 수 있습니다.이 행에는 다음과 같은 키가 포함되어야합니다.1:

어떻게 확장의 정보.이렇게 하면 확장 프로그램을 실행할 때 실행해야 하는 자바스크립트 파일을 알 수 있습니다.

확장 활성화 규칙:이 사전을 사용하여 확장을 활성화할 콘텐츠 유형을 결정하는 데 도움이 되는 작업 확장 키를 추가합니다.

다음과 같이 붙여 넣습니다.위의 키를 사용하여 런타임에 수행할”확장프로세싱”이라는 개체를 찾습니다. 이것은 애플의 문서에 더 자세히 설명되어 있습니다.

위의 자바스크립트 파일로 스크랩된 데이터를 검색하려면”공유 뷰 컨트롤러”내에서 이 코드 블록을 실행해야 합니다.이 문제를 해결하려면 다음 단계를 수행하십시오.:

import MobileCoreServices

이제 확장을 실행하면 콘솔에 성공적으로 인쇄됩니다!

사이드 노트:당신은 내가(자신의 이미지 또는 제목으로 대체)로 탐색 모음을 사용자 정의하려는 경우 다음 조각을 추가합니다.

구성 셀 추가

공유 확장 생성과 함께 제공된 상용구에는 구성 항목(공유 시트 아래쪽의 셀)을 선택적으로 제공하는 방법이 포함됩니다)

override func configurationItems() -> ! {

앱을 다시 실행하면 이제 하단에 셀이 표시됩니다.

구성 항목의 모델

“데크”라는 기본 모델을 만듭니다.스위프트”는 뷰 컨트롤러간에 데이터를 전달하는 데 앞서 사용됩니다.이 테이블보기와 함께 새로운보기로 푸시하는 구성 셀에 도청 할 때

표보기

처음에 지프에서,당신은 눈치 챘을 것이다. 새 파일 만들기스위프트”. 테이블 뷰 속성을 만들어 뷰에 추가합니다.

또한이 뷰의 제목 및 제목 색상을 설정하고 셀 식별자와 같은 상수를 구조체에 유지하는 것을 선호합니다:)

원래 뷰 컨트롤러에서 전달 된 데크를 저장할 속성을 만듭니다:

var userDecks = ()

그리고 테이블 뷰에 필요한 프로토콜을 준수하십시오.

응용 프로그램을 실행:

응용 프로그램을 실행합니다. 구성 셀을 탭하면 더미 데이터가 있는 테이블 뷰로 푸시됩니다.

그러나 구성 셀이 여전히”데크 제목”으로 하드 코딩되어 있음을 알 수 있습니다. 이 업데이트를 사용하려면 선택한 데크를 저장할 속성을 만들고 기본적으로 첫 번째를 선택합니다.

:

deck.value = selectedDeck?.title 

다시 응용 프로그램을 실행하고 당신은 그것이 업데이트 된 볼 수 있습니다.

선택한 덱을 업데이트하는 프로토콜

새 덱을 탭하면 공유 뷰 컨트롤러로 다시 해제할 수 있는 방법이 필요합니다. 프로토콜로 충분할 것입니다.

선택한 덱이 업데이트되고 구성 항목이 다시 로드되어 값을 업데이트합니다. 그런 다음 우리는 다시 메인 화면으로 이동 팝업.

응용 프로그램을 실행하고 지금 당신은 올바르게 선택한 데크를 보여주기 위해 업데이트됩니다 데크를 변경할 수 있어야한다 🙂

마무리

남은 것은 수집 된 정보를 서버 또는 앱으로 보내 다른 상용구 방법 내에서 수행 할 수있는 작업을 수행하는 것입니다:

override func didSelectPost()

나는 이것에 대해 자세히 설명하지 않겠지 만,나는 우리의 서버에 게시하기 위해 샐세션을 사용했다. 나는 또한 응용 프로그램 그룹을 만들고 공유 된 데이터를 사용하여 더미 데이터를 실제 데크로 대체했습니다.

let userDefaults = NSUserDefaults(suiteName: "some.group.name")
let decks = userDefaults?.objectForKey("userDecks") as? NSArray

마지막으로,당신은 내 확장 작업 대화 상자에서”버스”라는,그리고 아이콘이 있습니다 알 수 있습니다. 이 때문에 게시물에 따라 아이콘을 설정할 수 있습니다. 그리고 이름을 변경하려면 단순히 확장에 대한 프로젝트 설정에서”표시 이름”을 변경합니다.

그게 전부입니다.이 도움이 되었다면 다른 사람들이 추천하여 찾을 수 있도록 도와주세요.

여기에서 프로젝트 전체를 볼 수 있습니다.

태그

해커 정오 가입

사용자 정의 독서 경험의 잠금을 해제하기 위해 무료 계정을 만듭니다.

답글 남기기

이메일 주소는 공개되지 않습니다.