자주 쓰는 기능이기에 간단한 javascript로 tab 기능을 구현해 보았음.

로직:

클릭이 일어났을 때 showtab() 함수를 돌리고 함수에 포함된 반복문으로 파라메터와 탭 번호가 같은지 대조하여 같으면 display: block;, 다르면 display:none; 으로 처리하도록 하였다.

Javascript

function showtab(a){

for(i = 0 ; i <=2 ; i++){

var target = document.getElementById('tab' + i)

if(i == a){

target.style.display = 'block';

} else {

target.style.display = 'none';

}

}

}

HTML

<ul>

<li><a href="javascript:;" onclick="javascript:showtab(0);">show first tab</a></li>

<li><a href="javascript:;" onclick="javascript:showtab(1);">show second tab</a></li>

<li><a href="javascript:;" onclick="javascript:showtab(2);">show third tab</a></li>

</ul>

<div id="tab0" class="tab">

first tab

</div>

<div id="tab1" class="tab">

second tab

</div>

<div id="tab2" class="tab">

third tab

</div>

CSS

ul {

list-style-type: none;

padding: 0;

}

li {

display: inline-block;

margin-right: 15px;

}

.tab {

width: 240px;

height: 240px;

text-align: center;

background-color: red;

color: #fff;

padding: 30px;

display: none;

}

#tab0 {

display: block;

}

결과는 아래 링크에서 확인할 수 있음.

codepen에서 보기

오늘부터 MySQL + PHP를 공부하기 시작.

PHP를 본격적으로 파기 전에 SQL을 좀 공부해 둬야겠어서 오픈 강좌를 보고 열심히 진행 중.

오늘은 기초적인 명령에 대해 학습하였고 아래는 그 스터디 노트들임.

데이터베이스 리스트 호출

mysql> show databases;

데이터베이스 사용

mysql> use NameOfDataBase;

데이터베이스 테이블 만들기

mysql> CREATE TABLE nameOfTable (

nameOfFirstRow dataType(lengthOfData) NOT_NULL AUTO_INCREMENT,

nameOfSecondRow dataType NULL,

PRIMARY KEY (theValue)

);

//NOT_NULL: NULL이 아니어야 됨, AUTO_INCREMENT: 자동 증가, PRIMARY KEY: 정렬 기준이 되는 값(인것 같음)

테이블 항목 조회하기

mysql> desc nameOfTable;

테이블 모든 항목 데이터 조회하기

mysql> SELECT * FROM nameOfTable;

테이블 일부 항목 데이터 조회하기

mysql> SELECT firstRowName, secondRowName FROM nameOfTable;

테이블 항목 데이터 추가하기

mysql> INSERT INTO nameOfTable (firstRowName, secondRowName) VALUES('firstColumnValue', 'secondColumnValue');

테이블 항목 일부만 조회하기

mysql> SELECT * FROM nameOfTable WHERE nameOfValue = theValue;

//nameOfValue의 theValue값을 가진 항목을 표시해라

테이블 항목 갱신(수정)하기

mysql> UPDATE nameOfTable SET nameOfValue = theValue WHERE primaryKeyValue = theValue;

//primaryKeyValue의 theValue항목 중 nameOfValue 항목의 값을 theValue로 고쳐라(갱신해라).

테이블 항목 삭제하기

mysql> DELETE FROM nameOfTable WHERE primaryKeyValue = theValue;

//primaryKeyValue의 theValue항목이 있는 열을 삭제해라.

1. 프로젝트에 사용하고자 하는 폰트의 원도(otf, ttf 등)를 drag&drop으로 가져온다. (본 예제에서는 Noto Sans CJK KR medium을 사용했다.)

2. 아래와 같이 프로젝트의 info.plist에 Font provided by application을 등록하고 폰트 이름을 아이템에 넣어준다.

3. viewDidLoad 에 아래 코드를 넣고 빌드하면 콘솔에 사용 가능한 폰트 이름이 출력된다.

for name in UIFont.familyNames() {

            print(name)

            if let nameString = name as? String

            {

                print(UIFont.fontNamesForFamilyName(nameString))

            }

        }

4. 아래의 코드를 추가하여 폰트와 크기를 정한다.

myTextView.font = UIFont(name: "NotoSansCJKtc-Medium", size: 12)

5. PROFIT!

텍스트 속성 조절 가능한 UITextView의 subclass : MYTextFrame예제.

initializeTextBox()의 파라메터에 적절한 값을 넣어 주면 굴러감.

import UIKit

class MYTextFrame: UITextView {

    var contentText = NSString()

    func initializeTextBox(pathOfTextFile: String, typeOfExtension: String, spaceOfLine: CGFloat, canScroll: Bool, canEdit: Bool){

        //Text path

        let filePath = NSBundle.mainBundle().pathForResource(pathOfTextFile, ofType: typeOfExtension)

        //Text file to string

        do {

            contentText = try NSString(contentsOfFile: filePath!, encoding: NSUTF8StringEncoding)

        } catch {

            contentText = "text is not found."

        }

        //Line Spacing

        let lineSpaceAmount = NSMutableParagraphStyle()

        lineSpaceAmount.lineSpacing = spaceOfLine

        self.attributedText = NSAttributedString(string: contentText as String, attributes: [NSParagraphStyleAttributeName:lineSpaceAmount])

        //Scrollable?

        self.scrollEnabled = canScroll

        //Editable?

        self.editable = canEdit

    }

}

SNS 프로필 사진에서 쓰이는 방식과 같이 원형 프레임 안에 사진을 넣고 비율을 맞추는 코드.

import UIKit

let myView = UIImageView(frame: CGRect(x: 0, y: 0, width: 100, height: 100)) //이미지뷰 만들기

myView.layer.cornerRadius = myView.frame.width / 2 //프레임을 원으로 만들기

let myImage = UIImage(named: "bruceLee.gif") //이미지 객체 생성

myView.image = myImage //이미지를 이미지뷰에 넣기

myView.contentMode = UIViewContentMode.ScaleAspectFill //이미지 비율 바로잡기

myView.clipsToBounds = true //이미지를 뷰 프레임에 맞게 clip하기

Segue를 이용해서 다른 ViewController에 데이터 전달하는 코드

override func prepareForSegue(segue: UIStoryboardSegue, sender: AnyObject?) {

if (segue.identifier == "targetSegue"){

let targetView : targetViewController = segue.destinationViewController as! targetViewController

targetView.targetVariable = thisViewControllerVariable

}

}

이쪽 뷰 컨트롤러의 thisViewControllerVariable 변수 값을 targetViewController의 targetVariable이라는 변수에 전달한다.

targetViewController에서는 targetVariable 이라는 변수를 선언하면 값은 자동으로 전달됨.

아이폰 텍스트필드를 탭했을 때 나오는 키보드에 액세서리 뷰를 달아서 기타 콘트롤러를 붙일 수 있다.

import UIKit

class TextFieldWithAccessory: UITextField {

func makeAccessoryView(){

let numberToolBar : UIToolbar = UIToolbar(frame: CGRectMake(0, 0, self.frame.width, 40))

numberToolBar.barStyle = UIBarStyle.BlackTranslucent

let keyboardToolBarEmptySpace : UIBarButtonItem = UIBarButtonItem(barButtonSystemItem: UIBarButtonSystemItem.FlexibleSpace, target: nil, action: nil)

let keyboardToolBarDoneButton :UIBarButtonItem = UIBarButtonItem(title: "완료", style: UIBarButtonItemStyle.Done, target: self, action: "resignFirstResponder")

keyboardToolBarDoneButton.tintColor = UIColor.whiteColor()

numberToolBar.items = [keyboardToolBarEmptySpace,keyboardToolBarDoneButton]

numberToolBar.sizeToFit()

self.inputAccessoryView = numberToolBar

}

}

swift로 프로그래밍 하면서 UILabel이나 UIText 등의 폰트 이름을 바꿀 때 폰트 패밀리 이름을 몰라서 헤맬 때가 있는데 아래 함수를 한번 돌려주면 콘솔에 폰트 패밀리 이름을 쭉 뿌려줘서 편함.

func printFonts() {

let fontFamilyNames = UIFont.familyNames()

for familyName in fontFamilyNames {

print("------------------------------")

print("Font Family Name = [\(familyName)]")

let names = UIFont.fontNamesForFamilyName(familyName )

print("Font Names = [\(names)]")

}

}

step 1

우선 storyboard 에서 UIImageView 객체를 하나 집어넣고 적당힌 이미지를 입힌 다음 객체 속성에서 User Interaction Enabled를 체크해 준다.

그 다음 UIImageView 객체를 헤더 파일로 우클릭-드래그 해서 property로 선언하고 pinchGestureImage 로 이름짓는다.

이것으로 스토리보드에서 할일은 끝.

step 2

다음은 헤더에서 프로퍼티와 터치 입력이 발생했을 때 사용할 메서드를 선언해준다.

ViewController.h

--

#import <UIKit/UIKit.h>

@interface ViewController : UIViewController

@property (strong, nonatomic) IBOutlet UIImageView *pinchGestureImage; //터치 제스쳐가 일어날 UIImageView

@property UIAlertView *myAlert; //액션이 일어났을 때 보여줄 팝업창

-(void)pinchEnabled:(UIPinchGestureRecognizer *)recognizer; //이미지를 핀치했을때 동작할 메서드

@end

--

step 3

다음은 구현부에서 메서드를 정의해준다.

(XCode에서 자동으로 생성하는 부분-[super viewDidLoad] 등-은 제외함)

ViewController.m

--

//property 들을 synthesize 해준다.

@synthesize pinchGestureImage;

@synthesize myAlert;

-(void)pinchEnabled:(UIPinchGestureRecognizer *)recognizer

{

if (recognizer.state == UIGestureRecognizerStateBegan) //UIPinchGestureRecognizer 객체의 상태가 '시작'상태일 때

{

myAlert = [[UIAlertView alloc]initWithTitle:nil message:@"Hello!" delegate:nil cancelButtonTitle:@"close" otherButtonTitles:nil, nil]; //팝업창의 속성을 이와 같이 정의하고

[myAlert show]; //팝업을 띄운다

}

}

- (void)viewDidLoad {

UIPinchGestureRecognizer *myPinchGesture = [[UIPinchGestureRecognizer alloc]initWithTarget:self action:@selector(pinchEnabled:)]; //myPinchGesture 라는 터치 제스쳐를 하나 만들고 init하면서 target은 self, 제스쳐를 입력받아 동작한다면 pinchEnabled: 메서드를 따르도록 한다.

[pinchGestureImage addGestureRecognizer:myPinchGesture]; //myPinchGesture를 pinchGestureImage에 심는다.

}

@end

--

이제 시뮬레이터에서 앱을 빌드하면 아래와 같은 화면이 보인다.

그리고 이미지를 pinch 하면 팝업이 동작한다.

UIPinchGestureRecognizer 를 UILongTabRecognizer 등으로 교체하여 롱탭, 탭 등의 다른 제스쳐로도 응용 가능함.

UIGestureRecognizer 등의 방법을 쓸 수도 있으나

일단 ViewController에 아래 메소드를 입력하면 됨.

-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event {

for (UIView * youtxtfl in self.view.subviews){

if ([youtxtfl isKindOfClass:[UITextField class]] && [youtxtfl isFirstResponder]) {

[youtxtfl resignFirstResponder];

}

}

}