Hbuilder Packaging App Method

Source: Internet
Author: User
<span id="Label3"></p><p><p><span style="font-size: 16px">Hbuilder is a web development IDE that supports HTML5 in Dcloud (digital paradise). The software can either support Web Code authoring or package the project code that has been written as a mobile app.</span></p></p><p><p><span style="font-size: 16px">Hbuilder offers a package with cloud packaging and local packaging, cloud packaging is characterized by the Dcloud official configuration of the native packaging environment, HTML and other files can be compiled into a native installation Package.</span></p></p><p><p></p></p><p><p><span style="font-size: 18px">1, Download hbuilder, Register and Login. First Open "file"-"new"-"mobile app", enter "app name", "location" can be selected according to your needs, "select template" suggested to choose an empty template;</span></p></p><p><p></p></p><p><p><span style="font-size: 18px">2, after the new completion, in the project manager will display the new project directory, where Css,img,js and index.html these files can be deleted can be replaced.</span></p></p><p><p><span style="font-size: 16px">The Unpackage folder is a picture of the app icon and launch Screen.</span></p></p><p><p><span style="font-size: 16px">The Manifest.json file is a mobile app profile that specifies the App's display name, icon, app portal file address, and device permissions that need to be used, and the user can configure the mobile App's information through Hbuilder's Visual interface view or source View.</span></p></p><p><p></p></p><p><p><span style="font-size: 18px">3, If you delete the Css,img,js folder and the index.html file, copy the other project files to the folder, Note that the reference path in the HTML file needs to be maintained correctly.</span></p></p><p><p><span style="font-size: 16px">If you copy the Project:</span></p></p><p><p></p></p><p><p></p></p><p><p><span style="font-size: 18px">4, after the file copy is complete, refresh the update, double-click Open Manifest.json file to configure the app.</span></p></p><p><p><span style="font-size: 16px">Appid: Click the cloud to get it. Version Number: edit as Needed. Page entry: The default is index.html, changing the App's launch page to suit your project NEEDS. Application description: Fill it out yourself. Whether the app is full-screen: tick on the full screen display.</span></p></p><p><p></p></p><p><p><span style="font-size: 18px">5, icon configuration: Click on the icon below the page configuration, Configure the app display Icon.</span></p></p><p><p><span style="font-size: 16px">1) Click on the "+" symbol square box, Select the path of the icon to find the icon footage, and then click on the "automatically generate all icons and replace" button to complete the icon generation and Replacement.</span></p></p><p><p></p></p><p><p><span style="font-size: 16px">2), the generated icon is automatically under the Unpackage folder</span></p></p><p><p></p></p><p><p><span style="font-size: 18px">6, start picture (splash) configuration, Click Switch to start picture configuration</span></p></p><p><p><span style="font-size: 16px">1), Startup option: Default</span></p></p><p><p><span style="font-size: 16px">2), start the picture settings, according to your needs are Android or iOS platform, and then according to different devices to make a boot image<br></span></p></p><p><p><span style="font-size: 16px">3), Create a new file named "splash" under the Unpackage→res file, and put a good boot image in the File.</span></p></p><p><p></p></p><p><p><span style="font-size: 16px">4), Click "select" in the Start picture settings to find the boot image you just put in.</span></p></p><p><p></p></p><p><p><span style="font-size: 18px">7,SDK Configuration: There is a need to configure, there is no default on the LINE.</span></p></p><p><p><span style="font-size: 18px">8, Module Permissions Configuration: There is a need to configure, there is no default on the LINE.</span></p></p><p><p><span style="font-size: 18px">9, Page Reference Relationship:</span></p></p><p><p><span style="font-size: 16px">First click on "scan code", then click on the left index.html file</span></p></p><p><p><span style="font-size: 16px">What this function means: click on the left side of the HTML file, the right side will show different files, pictures and so On. Can represent the resources needed to load the HTML file on the Left.</span></p></p><p><p></p></p><p><p><span style="font-size: 18px">10, code view: in the code view to see if the settings are correct, OK after ctrl+s Saved.</span></p></p><p><p><span style="font-size: 18px">11, Set the configuration options, formally into the packaging phase</span></p></p><p><p><span style="font-size: 16px">Hbuilder: "release"-"release for native install package" start packing</span></p></p><p><p></p></p><p><p><span style="font-size: 16px">Here's An Introduction to iOS packaging</span></p></p><p><p><span style="font-size: 16px">1), If you choose the jailbreak package does not require an Apple certificate, the default settings can be packaged successfully, but packaged apps can only be installed in the jailbroken mobile phone, no jailbreak installed.</span></p></p><p><p><span style="font-size: 16px">2), If you use an Apple certificate, here is a tool to apply for iOS certificate Appuploader. Apple paid developer account, directly using the normal Apple id, you can use Appuploader to apply for iOS test certificate, packaged IPA installed to Non-jailbroken devices.</span></p></p><p><p><span style="font-size: 16px">Installation URL of the Tool: http://www.applicationloader.net/blog/zh/72.html</span></p></p><p><p><span style="font-size: 16px">Free Developer account for iOS certificate tutorial: http://www.applicationloader.net/blog/zh/1073.html</span></p></p><p><p></p></p><p><p><span style="font-size: 18px">12, Click OK after the successful submission, you can view the app packaging status</span></p></p><p><p></p></p><p><p><span style="font-size: 16px">When packaged successfully, you can download it manually and install it on your ipad via a third-party tool, Apple Assistant.</span></p></p><p><p></p></p><p><p><span style="font-size: 18px">13. Commissioning and Installation simulator</span></p></p><p><p><span style="font-size: 16px">If you need to debug your computer, then you need to install the simulator, please refer to http://ask.dcloud.net.cn/article/151 How to install the configuration phone simulator, Or in Hbuilder →→ run →→ phone run →→ How to install Configure Phone simulator to enter VIEW.</span></p></p><p><p><span style="font-size: 16px">If you need to install to the phone for real-computer debugging, connect the phone with a data cable to the computer, and then restart hbuilder→→ run →→ phone to run →→ connected to the real Machine.</span></p></p><p><p></p></p><p><p>Hbuilder Packaging App Method</p></p></span>

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.