Dienstag, 27. Januar 2015

Create an UIImage from String in Swift / Erstelle ein UIImage aus einem String in Swift


Swift Source Code:
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
func imageFromText(#text:String,font:UIFont,color:UIColor)->UIImage
    {
        let size : CGSize = (text as NSString).sizeWithAttributes([NSFontAttributeName: font])
        
        UIGraphicsBeginImageContextWithOptions(size, false, 0.0)
        (text as NSString).drawAtPoint(CGPointMake(0.0, 0.0), withAttributes: [NSFontAttributeName: font, NSForegroundColorAttributeName:color])
        
        let image : UIImage = UIGraphicsGetImageFromCurrentImageContext()
        UIGraphicsEndImageContext()
        
        return image
    }

Freitag, 23. Januar 2015

iOS UITableViewCell Custom Highlight (so gehts richtig/the right way)

English

What is the goal?

A UITableViewCell with custom selected/highlighted background color and text color (screenshot).


Summary

  1. Create new UIViewController, UITableView and UITableViewCell (don't forget reuseIdentifier) in storyboard.
  2. Create class for viewController and connect them with the viewController in the storyboard.
  3. Conect the tabele dataSource and delegate  with the viewController.
  4. Place UILabels in storyboard and choose the "Color" and "Highlighted" property.

  5. Add "numberOfRowsInSection" and "cellForRowAtIndexPath" method in viewController class (and protocols).
  6. In "cellForRowAtIndexPath" -> get a cell instance from your tableView and set the "selectedBackgroundView" property by using a new UIView with e.g. green backgroundColor 
Code: (Swift):

 func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell  
   {  
     var cellIdentifier = "resultCell"  
     var cell : UITableViewCell = tableView.dequeueReusableCellWithIdentifier(cellIdentifier, forIndexPath: indexPath) as UITableViewCell  
     var bgView : UIView = UIView()  
     bgView.backgroundColor = UIColor(red: 123.0/255.0, green: 156.0/255.0, blue: 210.0/255.0, alpha: 1.0)  
     cell.selectedBackgroundView = bgView  
     return cell  
   }  




Deutsch

Was will ich erreichen?

Eine UITableViewCell die beim Touch Event eine beliebige Farbe als Hintergrund erhält und dessen Textinhalte eine andere beliebige Farbe einnehmen (Siehe Screenshot).


Welche Motivation hatte ich dies zu schreiben?

Im Internet z.B. auf StackOverflow, gibt es viele Varianten wie man dieses Problem löst. Oftmals sind diese sehr abenteuerliche Konstruktionen die viel Mühe mit sich bringen. Dabei geht es eigentlich ganz einfach.

Was wird benötig?

Wird ein Storyboard genutzt, braucht man zunächst ein ViewController mit einer UITableView. Der TableView wird eine UITableViewCell hinzugefügt die wir unseren Bedürfnissen anpassen wollen. 
Nun platzieren wir in der Content View der UITableViewCell unsere UILabels. 

Voilà! Wir haben unsere CustomCell beinahe fertig.

Nun wählt man ein Label aus und klickt im Attribute Inspector auf eine Farbe für sein Label. Das macht man unter "Color". Etwas weiter unten findet man "Highlighted". Hier wählt man eine Farbe aus die angezeigt werden soll wenn die Zelle selektiert wurde. Damit sie jetzt noch eine andere Hintergrundfarbe erhält kann man entweder die sehr beschränkte Auswahl unter "Selection" nutzen die einem im Attribute Inspector angezeigt wird wenn man auf die Zelle klickt oder man wählt seine eigene Farbe in dem man der Zelle eine selectedBackgroundView spendiert. Dazu geht man im Quellcode in die Methode: "cellForRowAtIndexPath" und erstellt eine neue View. Dieser View gebt ihr eine Hintergrundfarbe, z.B. grün. Nun setzt ihr der aktiven Zelle die Eigenschaft selectedBackgroundView mit der grünen View.

Zusammenfassung:



  1. UIViewController mit UITableView und einer UITableViewCell (reuseIdentifier nicht vergessen) im Storyboard anlegen.
  2. Klasse für den ViewController und im Storyboard für den Controller eintragen.
  3. Tabellen DataSource und Delegate mit dem ViewController verknüpfen.
  4. UILabels im Storyboard platzieren und "Color" und "Highlighted" Farben setzen.

  5. In der ViewController Klasse die "numberOfRowsInSection" und "cellForRowAtIndexPath" Methode hinzufügen.
  6. In der "cellForRowAtIndexPath" Methode eine Zelle aus der TableView instanzieren und die Eigenschaft "selectedBackgroundView" mit einer neuen View setzten die z.B. eine grüne Hintergrundfarbe besitzt.
Code: (Swift):

 func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell  
   {  
     var cellIdentifier = "resultCell"  
     var cell : UITableViewCell = tableView.dequeueReusableCellWithIdentifier(cellIdentifier, forIndexPath: indexPath) as UITableViewCell  
     var bgView : UIView = UIView()  
     bgView.backgroundColor = UIColor(red: 123.0/255.0, green: 156.0/255.0, blue: 210.0/255.0, alpha: 1.0)  
     cell.selectedBackgroundView = bgView  
     return cell  
   }  

Dienstag, 1. Januar 2013

Unboxing Hoverboard

Prolog

Am letzten Tag im alten Jahr (2012) kam noch ein Paket aus den USA. Der DHL Bote wollte Geld für den Zoll und ich hatte keins in Bar daheim, also ging er wieder. Doch doch kaum war er weg, kam die Rettung zur Tür hinein und hatte noch 50 Euro in Bar bei sich... Dann hieß es, jetzt muss es schnell gehen. Schuhe an, Mantel an und die Treppen runter gerannt.... Der Blick die Straße herunter ... wo ist das gelbe DHL Auto....? DA! ca. 300 Meter ... Im Laufschritt und mit dem Bargeld bewaffnet doch noch erreicht kurz bevor er ins Auto einsteigen wollte.

ICH HATTE DAS PAKET IN MEINEN HÄNDEN!

Bilder











Video


Samstag, 13. Oktober 2012

Wie bekomme ich den Google+ Messenger auf den Desktop / How to run the Google+ Messenger on Desktop

Bestimmt hat der eine oder andere ein Smartphone mit Google+ und nutzt dort den Messenger.
Wenn man zuhause ist und am PC sitzt möchte man dann sein Gespräch vom Handy fortsetzen aber ohne nervige Smartphone Tastatur. Leider bietet Google keinen direkten Weg in den Chat zu gelangen. denn auf der Desktop Welt kann man nur über GTalk kommunizieren (WARUM AUCH IMMER).....

Was benötige ich?

BlueStacks  -> http://http://bluestacks.com

Was ist BlueStacks?
Blue Stacks ist eine art Android Simulator für den heimischen Desktop Computer. Mit BlueStacks kann man also Apps runterladen und ausführen.

Was ist zu tun?
1. BlueStacks runterladen
2. BlueStacks installieren
3. BlueStacks starten
4. nach Google suchen
5. Google+ installieren
6. nach dem einloggen muss über die Notificationbar (von oben runterziehen wie beim Smartphone) das Konto mit den nötigen rechten ausgestattet werden...
7. Messenger starten und CHATTTEN

////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

Requirements

BlueStacks  -> http://http://bluestacks.com

What is BlueStacks?
Blue Stacks is a android simulator for desktop computers. BlueStack is able to download and run any apps from Google Play Store.

ToDo List
1. download Bluestacks
2. install blueStacks
3. run blue stacks
4. search for google
5. install the google+ app
6. at the notificationbar (slide from the top) u have to accept account permissions for your google account
7. run the messenger ... enjoy


Freitag, 27. Juli 2012

Horizontaler UITableView (Trick)

Einleitung
Wer hat sich als iOS Entwickler noch nicht gefragt warum die UITableView nur vertikal scrollt?! ...
Es wäre doch super wenn sie das auch horizontal könnte. Ein kleiner Trick den ich im Netz gefunden habe macht die UITableView auch horizontal Scrollbar.

Funktionsweise
Die Tabelle wird um 90 Grad gedreht (auf die Seite gekippt), damit die Zellen aber nicht auch auf der Seite liegen werden diese wieder zurück gedreht.

Schritt 1:
Normalen ViewController anlegen der von UITableViewController erbt.

Schritt 2:
in der ViewDidLoad folgende zeilen eintragen um die Tabelle zu drehen


- (void)viewDidLoad
{
    [super viewDidLoad];
    
    const CGFloat k90DegreesCounterClockwiseAngle = (CGFloat) -(90 * M_PI / 180.0);
    CGRect frame = tableV.frame;
    tableView.transform = CGAffineTransformRotate(CGAffineTransformIdentity, k90DegreesCounterClockwiseAngle);
    tableView.frame = frame; 
}


Schritt 3:
In der Methode in der die UITableCellView erzeugt und konfiguriert wird die Zelle drehen

 - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    static NSString *CellIdentifier = @"Cell";
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
    
    if (!cell) 
    {
        cell = [[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];
    }    

    CGFloat k90DegreesClockwiseAngle = (CGFloat) (90 * M_PI / 180.0);    
    cell.transform = CGAffineTransformRotate(CGAffineTransformIdentity, k90DegreesClockwiseAngle);
    
   //your cell init here
    //.....................
    
    return cell;
}



Die Zellenbreite kann über die folgende Methode (die eigentlich für die Höhe zuständig ist) konfiguriert werden. In dem Codebeispiel gebe ich die Breite des Bildschirms zurück... so ist die Cell immer genau so breit wie eine Bildschirmbreite...

- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
    return self.view.bounds.size.width;
}

Mittwoch, 25. Juli 2012

iPhone Bedienung mal anders

Einleitung

Wer das iPhone kennt weiß so ziemlich schnell wie es zu bedienen ist. Das ist dem Bedienkonzept von Apple zuzuschreiben. Dieses ist in seine Navigationsstrukturen auch recht Übersichtlich. Mir persönlich wird es immer schnell langweilig wenn ich die 1000 App mit einer TabBar oder NavigationBar sehe. Deshalb habe ich neues Bedienkonzept gebaut welches mal ein wenig mehr Abwechslung bringen soll.

Video
Funktionsweise


Der Grundaufbau besteht aus einem eigenen neuen Controler Typ den ich TileViewController nenne. Er kann eigentlich unendlich viele Unterviewcontroller beherbergen ähnlich wie z.B. ein TabViewController.
Nach dem Initialisieren des TileViewControllers fügt man ihm lediglich seine gewünschten ViewController hinzu und gibt für jeden ViewController die Zeile an in der er dargestellt werden soll. Die Kachelgrößen werden dann automatisch vom TileViewController zugewiesen. 


Im Pseudocode sieht das ungefähr so aus:


[tileviewController addViewController:vc1 inRow:0];
[tileviewController addViewController:vc2 inRow:0];
[tileviewController addViewController:vc3 inRow:1];
[tileviewController addViewController:vc4 inRow:2];

Und schon haben wir folgende Zeilen:
Zeile 1: vc1;vc2
Zeile 2: vc3
Zeile 3: vc4

Wer Code sehen möchte kann mich gerne in den Kommentaren fragen ... Gruß Maurice
Wanna see code? ask me via comments

Donnerstag, 15. März 2012

Flash Builder, Mobile und der SplashScreen

Seit Flash Builder 4.6 gibt es die Möglichkeit für Mobile Apps eine SplashScreenImage  anzulegen...
Leider waren die Beispiele von Adobe für meine Zwecke nicht ausreichend... wer z.B. iPad, iPhone 3GS, iPhone 4S, Android Smartphone und Android Tablet abdecken will hat mehr Probleme mit dem Splashscreen als man sich vorstellen kann... hier meine Lösung die alle Varianten Abdeckt:



<?xml version="1.0" encoding="utf-8"?>
<s:SplashScreenImage xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark">
<fx:Declarations>
<!-- Platzieren Sie nichtvisuelle Elemente (z. B. Dienste, Wertobjekte) hier -->
</fx:Declarations>
<fx:Script>
<![CDATA[
import mx.core.FlexGlobals;
[Embed(source="assets/imgs/Default.png")] //320x480
[Bindable]
public var ios160p:Class;
[Embed(source="assets/imgs/DefaultLandscape.png")]  //480x320
[Bindable]
public var ios160l:Class;
[Embed(source="assets/imgs/Default@2x.png")]  //640x960
[Bindable]
public var ios320p:Class;
[Embed(source="assets/imgs/Default@2xLandscape.png")] //960x640
[Bindable]
public var ios320l:Class;
[Embed(source="assets/imgs/Default-Landscape~ipad.png")] //1024x748
[Bindable]
public var iosTablettL:Class;
[Embed(source="assets/imgs/Default-Portrait~ipad.png")] //768x1004
[Bindable]
public var iosTablettP:Class;
[Embed(source="assets/imgs/logoTabletPortraitDefault.png")] //800x1232
[Bindable]
public var andTablettP:Class;
[Embed(source="assets/imgs/logoTabletLandscapeDefault.png")] //1280x752
[Bindable]
public var andTablettL:Class;
[Embed(source="assets/imgs/logo160PortraitDefault.png")] //320x480
[Bindable]
public var and160p:Class;
[Embed(source="assets/imgs/logo160LandscapeDefault.png")] //480x320
[Bindable]
public var and160l:Class;
[Embed(source="assets/imgs/logo240PortraitDefault.png")] // 480x800
[Bindable]
public var and240p:Class;
[Embed(source="assets/imgs/logo240LandscapeDefault.png")] //800x480
[Bindable]
public var and240l:Class;
[Embed(source="assets/imgs/logo320PortraitDefault.png")] //640x960
[Bindable]
public var and320p:Class;
[Embed(source="assets/imgs/logo320LandscapeDefault.png")] //960x640
[Bindable]
public var and320l:Class;
// Override getImageClass() to return an image for iOS.
override public function getImageClass(aspectRatio:String, dpi:Number, resolution:Number):Class
{
// Is the application running on iOS?
var isIOS:Boolean = (Capabilities.version.indexOf("IOS") == 0 ? true:false);
if(aspectRatio == StageAspectRatio.PORTRAIT) //Portrait
{
if(dpi == 160 && resolution<1000)//real 160
return (isIOS==true?ios160p:and160p);
else if(dpi == 160 && resolution>1000)//tablett
return (isIOS==true?iosTablettP:andTablettP);
else if(dpi == 240) return and240p;
else if(dpi == 320)
return (isIOS==true?ios320p:and320p);
}
else //Landscape
{
if(dpi == 160 && resolution<1000) //real 160
return (isIOS==true?ios160l:and160l);
else if(dpi == 160 && resolution>1000)//tablett
return (isIOS==true?iosTablettL:andTablettL);
else if(dpi == 240) return and240l;
else if(dpi == 320)
return (isIOS==true?ios320l:and320l);
}
return super.getImageClass(aspectRatio, dpi, resolution);
}
]]>
</fx:Script> </s:SplashScreenImage>