Mobile Platform as a Service:Mulai Cepat

Pilih garis dasar.

Cube Card kini didukung dalam garis dasar utama 10.2.3. Pilih metode penambahan komponen yang sesuai berdasarkan metode integrasi Anda.

• Gunakan mPaaS Xcode Extension

  Metode ini berlaku untuk integrasi: Integrasikan berdasarkan kerangka kerja mPaaS atau Integrasikan menggunakan plugin mPaaS ke proyek yang sudah ada.

  1. Klik menu Xcode Editor > mPaaS > Edit Project  > Upgrade Baseline untuk mengalihkan proyek ke garis dasar 10.2.3.

     Catatan

     Jika opsi "Upgrade Baseline" tidak dapat diklik, pastikan konfigurasi proyek telah diimpor. Lihat bagian Prasyarat untuk membuka halaman pengeditan proyek.

  2. Setelah memperbarui garis dasar, klik Edit Module > Modify Module, pilih Cube Card, simpan, lalu klik Start Editing untuk menyelesaikan penambahan.

• Gunakan Plugin cocoapods-mPaaS

  Metode ini cocok untuk integrasi: Integrasikan menggunakan CocoaPods ke proyek yang sudah ada.

  1. Lakukan langkah berikut dalam Podfile.

     1. Ubah mPaaS_baseline menjadi 10.2.3.

     2. Gunakan mPaaS_pod "mPaaS_Cube" untuk menambahkan dependensi komponen Cube Card.

  2. Jalankan perintah pod install untuk menyelesaikan integrasi.

Inisialisasi kartu.

1. Kompilasi proyek Xcode. Jika file header tidak ditemukan, aktifkan opsi Allow Non-modular Includes In Framework Modules dan atur nilainya ke Yes, seperti yang ditunjukkan pada gambar berikut.

   

2. Tambahkan dependensi sistem.

   

3. Impor library yang diperlukan untuk Cube Card.

   #import <CubeCrystal/CubeEngine.h>
   #import <AntCube/CubeService.h>

4. Gunakan singleton untuk menginisialisasi engine kartu.

   - (void)initEngie{
       static dispatch_once_t onceToken;
       NSString *mockBundlePath = [NSString stringWithFormat:@"%@/%@/crystal", [[NSBundle mainBundle] resourcePath], @"MPCubeDemo.bundle"];
       dispatch_once(&onceToken, ^{
           CubeEngineConfig* config = [[CubeEngineConfig alloc] init];
           [config setBundlePath:mockBundlePath];
           [[CubeService sharedInstance] initWithConfig:config]; 
       });
   }

Bangun proyek kartu.

1. Inisialisasi proyek. Jalankan perintah act init di terminal.

   • Pilih Jenis Aplikasi sebagai Cube dan pilih Template Card (format VUE).

   • Masukkan nama aplikasi. Masukkan nama untuk proyek Anda. Disarankan menggunakan kombinasi huruf Inggris, angka, dan garis bawah.

   • Pilih "Create an additional project source code folder". Opsi ini akan membuat folder tambahan yang dinamai sesuai aplikasi. Jika Anda memilih "Do not", proyek akan diinisialisasi langsung di direktori saat ini.

2. Bangun proyek. Jalankan perintah cd untuk membuka proyek kartu yang telah dibuat, lalu jalankan act build untuk menyelesaikan pembangunan. Hasil pembangunan akan tersimpan di folder /dist/ proyek Anda.

   

Lepaskan kartu.

1. Buka platform Ant Cube Card.

   

2. Klik Create Card.

   

   Disarankan menggunakan kombinasi huruf Inggris, angka, dan garis bawah untuk ID kartu. Klien akan menggunakan ID kartu ini saat merender kartu. Nama kartu dapat berisi nilai apa pun.

3. Tambahkan sumber daya kartu.

   • Disarankan menggunakan nomor versi 4 digit.

   • Pilih file main.zip yang baru saja dikompilasi.

   • Rentang klien mengacu pada versi klien yang dapat menarik kartu tersebut. Jika ingin menimpa semua versi klien, masukkan 0.0.0.0 di kolom versi minimum.

   

4. Lepaskan kartu.

   1. Klik Create Release.

      

   2. Pilih Official Release.

      

   Setelah kartu diterbitkan, klien dapat menarik kartu tersebut.

Render kartu.

1. Salin ID kartu dan nomor versi kartu dari halaman web.

   //Buat objek kartu.
   CubeCardConfig *cardConfig = [[CubeCardConfig alloc] init];
   //Konfigurasikan versi kartu (wajib), disalin dari konsol.
   [cardConfig setVersion:@"1.0.0.0"];
   //Konfigurasikan ID kartu (wajib), disalin dari konsol.
   [cardConfig setTemplteId:@"20211118"];
   //Atur lebar kartu sebelumnya.
   [cardConfig setWidth:[UIScreen mainScreen].bounds.size.width];
   //Atur tinggi kartu sebelumnya.
   [cardConfig setHeight:350];
   //Atur parameter data kartu (wajib) ke data JSON bisnis.
   [cardConfig setData:@{}];
   //Muat kartu.
   [[[CubeService sharedInstance] getEngine] createCard:cardConfig callback:self];
   

2. Kartu mengambil kunci "iosImage", lalu akan memperoleh nilai yang sesuai dengan kunci tersebut, seperti yang ditunjukkan pada kode berikut:

    [self.cardConfig setData:@{@"iosImage":@"https://img.zcool.cn/community/013edb5c7b5b1ca801213f269fc887.jpg@1280w_1l_2o_100sh.jpg"}];

3. Metode delegate setelah pembuatan kartu harus mematuhi protokol CCardCallback dan mengimplementasikan metode protokol onLoaded:cardType:config:erroCode.

   @interface ViewController () <CCardCallback>
   @end

   - (void)onLoaded:(CubeCard *)card cardType:(CCardType)cardType config:(CubeCardConfig *)config erroCode:(CubeCardResultCode)erroCode {
       //Pembuatan kartu gagal
       if (!card) {
           NSLog(@"load card fail %@ style %d error %d", [config templteId], cardType, erroCode);
           return;
       }
       
       //Pembuatan berhasil
       NSLog(@"load card success %@ style %d error %d", [config templteId], cardType, erroCode);
       
       dispatch_async(dispatch_get_main_queue(), ^{
           //Operasi UI di thread utama: Rendering kartu
   		CubeView *view = [[[CubeService sharedInstance] getEngine] createView];
           CGSize size = [card getSize];
           [view setFrame:CGRectMake(0, 20, size.width, size.height) ];
           [self.view addSubview:view];
           
           [card renderView:view];
       });
   }

4. Bangun & Jalankan.

   • Jika kompilasi dan eksekusi berhasil, command line Xcode mungkin melaporkan pengecualian permintaan RPC. Untuk detailnya, lihat Pengecualian permintaan RPC.

Pratinjau efek.