MNT2014: Mobile Hibrido com Phonegap
•
6 j'aime•1,715 vues
Palestra apresentada no dia 29 de março de 2014 no 2 encontro das mulheres na tecnologia, em Goiânia - GO.
Recommandé
Recommandé
Contenu connexe
En vedette
En vedette (20)
Similaire à MNT2014: Mobile Hibrido com Phonegap
Similaire à MNT2014: Mobile Hibrido com Phonegap (20)
Dernier
Dernier (20)
MNT2014: Mobile Hibrido com Phonegap
- 2. Me,Myself && I ! •Gerente de Desenv Projetos •8+ XP TI •Java JUG Leader •Sencha Community Leader •http://loiane.com •@loiane
- 8. Android iOS Windows Phone • Java • Eclipse (qualquer OS) 100
- 9. Android iOS Windows Phone • Java • Eclipse (qualquer OS) 100 • Objective C • Xcode + Mac OS 100
- 10. Android iOS Windows Phone • Java • Eclipse (qualquer OS) 100 • Objective C • Xcode + Mac OS 100 • C#/XAML • Visual Studio + Windows 100
- 11. Android iOS Windows Phone • Java • Eclipse (qualquer OS) 100 • Objective C • Xcode + Mac OS 100 • C#/XAML • Visual Studio + Windows 100 300 Dev Mant
- 14. CSS HTMLJavascript Desenvolvimento Híbrido Mobile Windows Phone IOS Android Plataformas diferentes como target
- 19. PhoneGap
- 20. Acesso Nativo ao Device usando apenas JavaScript. “ http://phonegap.com/
- 21. App Nativa Dispositivo App Híbrida executa UI e (alguma) lógica de negócio Código Nativo Interpretador JavaScript Ponte
- 22. App Nativa Dispositivo App Híbrida executa UI e (alguma) lógica de negócio Código Nativo Interpretador JavaScript Ponte Web Server Java/PHP/ Ruby/C# Arquivos Imagens/ Documentos Banco de Dados Backend http:// Lógica de negócio http://
- 23. Desenvolvimento de App Híbrida
- 24. Desenvolvimento de App Híbrida Passo 1: Criar app com HTML/JS/CSS
- 25. Desenvolvimento de App Híbrida Passo 1: Criar app com HTML/JS/CSS Passo 2: Criar projeto usando API Phonegap e caso seja necessário usar API para acesso nativo
- 26. Desenvolvimento de App Híbrida Passo 1: Criar app com HTML/JS/CSS Passo 2: Criar projeto usando API Phonegap e caso seja necessário usar API para acesso nativo Passo 3: Fazer Build e empacotar app
- 27. Desenvolvimento de App Híbrida Passo 1: Criar app com HTML/JS/CSS Passo 2: Criar projeto usando API Phonegap e caso seja necessário usar API para acesso nativo Passo 3: Fazer Build e empacotar app Passo 4: Enviar para App Store,Google Play, Market Place,etc
- 29. Phonegap não converte em código nativo
- 30. import android.app.Activity;! import android.content.Intent;! import android.graphics.Bitmap;! import android.os.Bundle;! import android.view.View;! import android.widget.Button;! import android.widget.ImageView;! ! public class MyCameraActivity extends Activity {! private static final int CAMERA_REQUEST = 1888; ! private ImageView imageView;! ! @Override! public void onCreate(Bundle savedInstanceState) {! super.onCreate(savedInstanceState);! setContentView(R.layout.main);! this.imageView = (ImageView)this.findViewById(R.id.imageView1);! Button photoButton = (Button) this.findViewById(R.id.button1);! photoButton.setOnClickListener(new View.OnClickListener() {! ! @Override! public void onClick(View v) {! Intent cameraIntent = new Intent(android.provider.MediaStore.ACTION_IMAGE_CAPTURE); startActivityForResult(cameraIntent, CAMERA_REQUEST); ! }! });! }! ! protected void onActivityResult(int requestCode, int resultCode, Intent data) { ! if (requestCode == CAMERA_REQUEST && resultCode == RESULT_OK) { ! Bitmap photo = (Bitmap) data.getExtras().get("data"); ! imageView.setImageBitmap(photo);! } ! } ! }!
- 31. - (BOOL) startCameraControllerFromViewController: (UIViewController*) controller! usingDelegate: (id <UIImagePickerControllerDelegate,! UINavigationControllerDelegate>) delegate {! ! if (([UIImagePickerController isSourceTypeAvailable:! UIImagePickerControllerSourceTypeCamera] == NO)! || (delegate == nil)! || (controller == nil))! return NO;! ! ! UIImagePickerController *cameraUI = [[UIImagePickerController alloc] init];! cameraUI.sourceType = UIImagePickerControllerSourceTypeCamera;! ! // Displays a control that allows the user to choose picture or! // movie capture, if both are available:! cameraUI.mediaTypes =! [UIImagePickerController availableMediaTypesForSourceType:! UIImagePickerControllerSourceTypeCamera];! ! // Hides the controls for moving & scaling pictures, or for! // trimming movies. To instead show the controls, use YES.! cameraUI.allowsEditing = NO;! ! cameraUI.delegate = delegate;! ! [controller presentModalViewController: cameraUI animated: YES];! return YES;! }!
- 32. // Check to see if the camera is available on the device.! if (PhotoCaptureDevice.AvailableSensorLocations.Contains(CameraSensorLocation.Back) ||! PhotoCaptureDevice.AvailableSensorLocations.Contains(CameraSensorLocation.Front))! {! // Initialize the camera, when available.! if (PhotoCaptureDevice.AvailableSensorLocations.Contains(CameraSensorLocation.Back))! {! // Use the back camera.! System.Collections.Generic.IReadOnlyList<Windows.Foundation.Size> SupportedResolutions = ! PhotoCaptureDevice.GetAvailableCaptureResolutions(CameraSensorLocation.Back);! Windows.Foundation.Size res = SupportedResolutions[0];! this.captureDevice = await PhotoCaptureDevice.OpenAsync(CameraSensorLocation.Back, res);! }! else! {! // Otherwise, use the front camera.! System.Collections.Generic.IReadOnlyList<Windows.Foundation.Size> SupportedResolutions = ! PhotoCaptureDevice.GetAvailableCaptureResolutions(CameraSensorLocation.Front);! Windows.Foundation.Size res = SupportedResolutions[0];! this.captureDevice = await PhotoCaptureDevice.OpenAsync(CameraSensorLocation.Front, res);! }! ...! ...! ...! ! //Set the VideoBrush source to the camera.! viewfinderBrush.SetSource(this.captureDevice);! ! // The event is fired when the shutter button receives a half press.! CameraButtons.ShutterKeyHalfPressed += OnButtonHalfPress;! ! // The event is fired when the shutter button receives a full press.! CameraButtons.ShutterKeyPressed += OnButtonFullPress;! ! // The event is fired when the shutter button is released.! CameraButtons.ShutterKeyReleased += OnButtonRelease; }! else! {! // The camera is not available.! this.Dispatcher.BeginInvoke(delegate()! {! // Write message.! txtDebug.Text = "A Camera is not available on this phone.";! });! }!
- 33. function capturePicture(){! ! navigator.camera.getPicture( cameraSuccess, cameraError, {! ! ! quality: 50,! ! ! destinationType: destinationType.DATA_URL! ! } );! }!
- 34. Phonegap não tem componente,não se integra com server (php,java)
- 37. Phonegap não gera projeto web,gera projeto nativo que faz uso da API do phonegap
- 40. Processo de build e processo de enviar para apps store é nativo
- 45. Não serve para qualquer app
- 46. Demo
- 50. 1
- 58. 2
- 59. 3
- 61. 4