Am Anfang stand die Idee: Ein beliebig abgespeichertes Bild am Windows Phone selektieren und darauf zu zeichnen und seine Notizen machen – oder schnell mit der Kamera ein Bild machen und dies beschriften. Danach dieses Bild mit den Notizen speichern, per eMail verschicken oder gar auf FaceBook zu posten.
Gesagt getan – einen Namen hatte ich auch schon: PadBook J - mit welche Herausforderungen muss ich mich intensiv beschäftigen?
· Neues Bild mit der Kamera aufnehmen
· Bestehendes Bild aus der Gallery selektieren
· Mit dem Finger auf einem Bild zeichnen können
· Die gezeichneten Notizen gemeinsam mit dem Bild wegspeichern
· Settings: unterschiedliche Malfarbe und Strichstärke
Also zuerst zum Malen: eine weiße Fläche und darauf mit dem Zeigefinger zu zeichnen, stellte sich eigentlich nicht wirklich als Herausforderung dar: Als Zeichenfläche nahm ich ein <InkPresenter> -Control und im MouseLeftButtonDown() malte ich schließlich die einzelnen Punkte. Hier die komplette Mal-Routine:
Private Sub drawingCanvas_MouseLeftButtonDown(sender As Object, e As System.Windows.Input.MouseButtonEventArgs) Handles drawingCanvas.MouseLeftButtonDown
'draw the necessary action
drawingCanvas.CaptureMouse()
_colorStroke = New System.Windows.Ink.Stroke()
_colorStroke.StylusPoints.Add(GetStylusPoint(e.GetPosition(drawingCanvas)))
_colorStroke.DrawingAttributes.Color = colorPicked.Color
_colorStroke.DrawingAttributes.Height = _strokeSize
_colorStroke.DrawingAttributes.Width = _strokeSize
drawingCanvas.Strokes.Add(_colorStroke)
End Sub
Private Function GetStylusPoint(position As Point) As StylusPoint
'get Point of the drawing surface
Return New StylusPoint(position.X, position.Y)
End Function
Private Sub drawingCanvas_MouseLeftButtonUp(sender As Object, e As System.Windows.Input.MouseButtonEventArgs) Handles drawingCanvas.MouseLeftButtonUp
'stop drawing
_colorStroke = Nothing
End Sub
Private Sub drawingCanvas_MouseMove(sender As Object, e As System.Windows.Input.MouseEventArgs) Handles drawingCanvas.MouseMove
'move the mouse / hand
If (_colorStroke IsNot Nothing) Then
_colorStroke.StylusPoints.Add(GetStylusPoint(e.GetPosition(drawingCanvas)))
End If
End Sub
Also nächste Herausforderung: Mit der Kamera Bild aufnehmen oder vorhandenes aussuchen: Ein nettes sehr gutes Beispiel fand ich auf der create.msdn.com Seite, der das Aufnehmen eines Bildes it der Kamera und das Abspeichern in die Bibliothek sehr gut erklärt: http://create.msdn.com/en-US/education/quickstarts/Developing_with_the_Windows_Phone_Camera - daran habe ich mich gehalten – nach 20 Minuten war dies implementiert.
Ein wenig Research hat es mich gekostet, wie ich schließlich die gezeichneten Informationen gemeinsam mit dem Bild als Screenshot in die Gallery wegspeichern kann. Dies habe ich schließlich folgendermaßen gemacht (Im System.Windows.Media.Imaging Namespace wird man fündig J)
'Take a screenshot
Dim ScreenShotArea As New WriteableBitmap(Me, Nothing)
Dim ScreenShotLibName As String = "PadBook " + DateTime.Now.Ticks.ToString
Using memStream = New MemoryStream()
ScreenShotArea.SaveJpeg(memStream, 480, 800, 0, 100)
memStream.Seek(0, SeekOrigin.Begin)
Dim library As New MediaLibrary()
Dim PictureSaved = library.SavePicture(ScreenShotLibName, memStream)
End Using
Windows.MessageBox.Show("Picture saved successfully", "PadBook", MessageBoxButton.OK)
Naja, dann noch eine eigene Seite für die Settings der Strichfarbe und Strichstärke bauen und dies dem Style beim Zeichnen selbst zuweisen – that’s it … fertig war meine PadBook-App.
Robert John
Snr. Technical Evangelist – Windows Phone
Microsoft Österreich
