By Hoshino

0

iPhoneで時々Tweetボタンが表示されない時

こんにちは。 最近近くのコンビニは「取り出すのにお金が掛かる自分の冷蔵庫」と考えるようにしました。 さて、冷蔵庫と言えばTweetボタンですが、最近なんだかiPhoneで表示されない時がしばしば。 原因は謎ですが、最新コードと差分があったので書き直します。 ⇒ Twitter Buttons Generator いままで(JS部分) !function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=” //platform.twitter.com/widgets.js”;fjs.parentNode.insertBefore(js,fjs);}}(document,”script”,”twitter-wjs”); 新しいの(JS部分) !function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?’http’:’https’;if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+’: //platform.twitter.com/widgets.js’;fjs.parentNode.insertBefore(js,fjs);}}(document, ‘script’, ‘twitter-wjs’); なんかtestとか気になる関数が追加されてます。 こちらに変更したところばっちぐーで表示されるようになりました。めでたし。 要するに あれ?なんかおかしいなと思ったら本家のサイトからコードを取得し直すと良いカモ。ということです。 ⇒ Twitter Buttons Generator ではでは。

View More

By Hoshino

0

setTimeoutの削除【JavaScript】

ボタンを押したら3秒後にアラートを出すなんてブロックを用意します。 ボタン1 コードはこんな感じ。jQuery使ってます。 $(‘#btn’).click(function(){        setTimeout(function(){                alert(‘あっきぃだよ!’);        }, 1000 * 3);}); setTimeoutで3秒後にアラートだぜ。いい感じだぜ。と思いきや、これだとボタンを連打すると、その数だけアラートが出てしまいます。 それは良くないことが起こりそうなので、clearTimeoutで連打を阻止しましょう。 var timer;$(‘#btn’).click(function(){        clearTimeout(timer);        timer = setTimeout(function(){                alert(‘あっきぃだよ!’);        }, 1000 * 3);}); ボタン2 これで最後にボタンを押してから3秒後にアラートになります。 もしも、最初にボタンを押してから3秒後にアラートにしたい場合は、こんな感じに。 var timer;$(‘#btn’).click(function(){        if(!timer) {                timer = setTimeout(function(){                        alert(‘あっきぃだよ!’);                        timer = null;                }, 1000 * 3);        }}); ボタン3 timerになんか入っているかどうかで判定します。 ばっちぐー

View More

By Hoshino

0

UIViewのframe.size.widthとかめんどくさいので省略する

UIViewの幅や高さにアクセスするのがめんどくさいので省略出来るようにします。 UIView+Simple.h/mという名前のUIViewを拡張するカテゴリファイルを追加します。 //UIView+Simple.h #import <UIKit/UIKit.h> @interface UIView (Simple)-(CGFloat)width;-(CGFloat)height;-(CGFloat)x;-(CGFloat)y;-(CGPoint)o;-(CGFloat)right;-(CGFloat)bottom;-(void)toFront;-(void)toBack;-(CGSize)trueSize;@end //UIView+Simple.m #import “UIView+Simple.h” @implementation UIView (Simple)-(CGFloat)width { return self.frame.size.width; }-(CGFloat)height { return self.frame.size.height; }-(CGFloat)x { return self.frame.origin.x; }-(CGFloat)y { return self.frame.origin.y; }-(CGPoint)o { return CGPointMake(self.width / 2, self.height / 2); }-(CGFloat)right { return self.frame.origin.x + self.frame.size.width; }-(CGFloat)bottom { return self.frame.origin.y + self.frame.size.height; }-(void)toFront { [self.superview bringSubviewToFront:self]; }-(void)toBack { [self.superview sendSubviewToBack:self]; }-(CGSize)trueSize { CGAffineTransform t = self.transform; self.transform = CGAffineTransformIdentity; CGSize size = self.frame.size; self.transform = t; return size; }@end UIView+Simple.hをPCHファイルなんかで全体に読み込まれるようにしておきます。 #import “UIView+Simple.h” そんでもって使い方。 例1.親Viewの中央に乗せる subview.center = view.o;[view addSubview:subview]; 例2.View1の右隣にマージン14pxでView2を設置する view2.frame = CGRectMake(view1.right + 14.0, view1.y, view2.width, view2.height); 例3.Viewを先頭に持ってくる [view toFront] などなどなどなど… (便利でしょ?) 他にも省略したいものがあればココにどんどん追加すればいいのでーす♪

View More

By Hoshino

0

UIViewを反転させる

UIViewを反転させる方法です。 CGAffineTransformを使えば1行でいけます。 例のごとく対象となるUIViewを用意しましょう。 – (void)viewDidLoad {        [super viewDidLoad];         UIView *view = [UIView new];        view.frame = CGRectMake(0, 0, 200, 200);        view.backgroundColor = [UIColor redColor];        view.center = CGPoinMake(self.view.frame.size.width/2, self.view.frame.size.height/2);        [self.view addSubview:view];         UIImageView *imageView = [UIImageView new];        imageView.image = [UIImage imageNamed:@”apple”];        [view addSubview:imageView];        …} ふむ。 1.左右反転 x軸方向に-1倍拡大してあげるだけです。 view.transform = CGAffineTransformMakeScale(-1, 1); 2.上下反転 y軸方向に-1倍拡大してあげるだけです。 view.transform = CGAffineTransformMakeScale(1, -1); 3.上下左右反転 流れでわかると思いますが、x,y軸方向に-1倍拡大してあげるだけです。 view.transform = CGAffineTransformMakeScale(-1, -1); 簡単ですな。

View More

By Hoshino

0

UIViewの回転、拡大、縮小

iPhoneアプリといえばアニメーションが綺麗です。 どこぞのアンドロイドと違って変にカクカクしないですし、滑らかです。 そしてアニメーションといえば移動、回転、拡大、縮小の組み合わせが多いでしょう。 そんなわけで今回はUIViewをCGAffineTransformとか言うよく分からない奴で移動、回転、拡大、縮小をする方法の基本を学びましょう。 とりあえず対象のViewを用意します。 ほおおおおお…そいやっ – (void)viewDidLoad {        [super viewDidLoad];         UIView *view = [UIView new];        view.frame = CGRectMake(0, 0, 200, 200);        view.backgroundColor = [UIColor blueColor];        view.center = CGPoinMake(self.view.frame.size.width/2, self.view.frame.size.height/2);        [self.view addSubview:view];         UIImageView *imageView = [UIImageView new];        imageView.image = [UIImage imageNamed:@”apple”];        [view addSubview:imageView];        …} いい感じですね。 そして相変わらずこのブログのコードのカラーリングはとっても見やすいです。 1.移動 右に40px、上に50px移動させます。 view.transform = CGAffineTransformMakeTranslation(40, -50); 2.回転 30°右に回転させます。 view.transform = CGAffineTransformMakeRotation(M_PI * 30.0 / 180.0); こんなDefineを用意すればスッキリします。 #define RADIAN(x) (M_PI * (x) / 180.0)…view.transform = CGAffineTransformMakeRotation(RADIAN(30)); 3.拡大と縮小 拡大と縮小です。比率を大きくすれば拡大、小さくすれば縮小出来ます。 view.transform = CGAffineTransformMakeScale(1.5, 1.5); 第1引数がx方向の拡大率、第2引数がy方向の拡大率なので、別の値を入れれば歪ませることも出来ます。 view.transform = CGAffineTransformMakeScale(0.5, 1.2); 4.初期化 真っさらな状態に戻します。つまりデフォルト値です。 view.transform = CGAffineTransformIdentity; 5.組み合わせる 「拡大して回転」みたいにアフィン変換を組み合わせます。 5.1.対象となるCGAffineTransformを指定するパターン アフィン変換をかける対象となるCGAffineTransformを指定するパターンです。 こんな感じ。 view.transform = CGAffineTransformMakeScale(1.2, 1.2);view.transform = CGAffineTransformRotate(view.transform, RADIAN(50));view.transform = CGAffineTransformTranslate(view.transform, -30, 30); 注意する点として、こちらは一見「1.2倍に拡大」⇒「右に50°傾ける」⇒「左に30px、下に30px移動」ってな変換をしてるイメージですが、Makeが付かないCGAffineTransformXXXの関数は第2引数の処理の後、第1引数のCGAffineTransformを掛けるので、 ①「1.2倍に拡大」②「右に50°傾ける」⇒①③「左に30px、下に30px移動」⇒② となり、実際は「左に30px、下に30px移動」⇒「右に50°傾ける」⇒「1.2倍に拡大」という処理になります。 5.2.CGAffineTransformを合成するパターン 複数のCGAffineTransformを合成したものを最後に適用させるパターンです。 CGAffineTransform t1 = CGAffineTransformMakeTranslation(-30, 30);CGAffineTransform t2 […]

View More

By Hoshino

0

YouTubeのURLをJavaScriptで自動で埋め込みプレイヤーにする

極秘で運営している「SHINDAN.in」というものがあります。 名前診断を作成するサイトです。そしてよく考えたら極秘ではなかったです。 ただ名前診断で結果を出すだけじゃ、なんだかありきたりでインパクトがないような気がするので、今日は診断結果にYouTubeのURLを入れると埋め込みプレイヤーに変換するようにJavaScriptで実装したいと思います。 1.難しい話じゃない ぱっと見難しいような気がしますが、そんなことはありません。 要するに… こんなURLを検知して、 こんな風に埋め込みプレイヤーのコードに変換するだけなのです。 <iframe src=”http://www.youtube.com/embed/6CKZgIYJa3o” frameborder=”0″ allowfullscreen></iframe> 2.注意点 YouTubeのリンクは主に2種類あります。 このようにGET値がついた通常のURLと、 YouTubeが提供している短縮URLです。 このどちらにも対応したコードを書きましょう。 3.いざ実装 えいやっ //HTMLデコードする関数var decodeHTML = function(str) {        var decoded = $(“<div/>”).html(str).text();        return decoded;}; //PHPで言うpreg_match_allをやってくれる関数var preg_match_all = function(regex, haystack) {        var globalMatch = haystack.match(regex);        var matchArray = new Array();        for(var i in globalMatch) {                try {                        var nonGlobalRegex = new RegExp(regex);                        var nonGlobalMatch = globalMatch[i].match(nonGlobalRegex);                        matchArray.push(nonGlobalMatch[0]);                } catch(e){}        }        return matchArray;}; //URLからGET値のKeyを指定したら取って来てくれるvar getParameterByName = function(name, url) {        var query_string = url.split(“?”);        if(query_string.length >= 2) {                var params = query_string[1].split(“&”);                var i = 0;                while(i < params.length) {                        var param_item = params[i].split(“=”);                        if(param_item[0] == name) return param_item[1];                        i++;                }                        }        return “”;}; //YouTubeの埋め込みvar youTubeEmbed = function(text) {        var URLs = preg_match_all(/(\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/ig, text);        for(var i = 0; i < URLs.length; i++) {                var url = URLs[i];                if(url.match(/(?:http:\/\/)?(?:www\.)?(?:youtube\.com|youtu\.be)\/(?:watch\/)?(.+)/g)) { //YouTubeのリンクかどうか判定                        var youTubeId = getParameterByName(‘v’, decodeHTML(url));                        if(youTubeId == ”) youTubeId = url.replace(/(?:http:\/\/)?(?:www\.)?(?:youtube\.com|youtu\.be)\/(?:watch\/)?(.+)/g, ‘$1’);                        youTubeId = (youTubeId.split(‘#’))[0]; //時間指定を消す。(残したい場合はこの処理いらないよっ)                        text = text.replace(url, ‘<iframe src=”http://www.youtube.com/embed/’+youTubeId+’” frameborder=”0″ allowfullscreen></iframe>’);                }        }        return text;}; こんな感じ。 関数名やコメントアウトを見れば意味は分かると思います。 (正規表現についてはじーっと見てればそのうち分かる気がする今日このごろ。) ちゃんと動くかどうか試してみます。 var text = ‘https://www.youtube.com/watch?v=6CKZgIYJa3oというリンクとhttp://youtu.be/6CKZgIYJa3oというリンクです。’;console.log(youTubeEmbed(text)); 結果は <iframe src=”http://www.youtube.com/embed/6CKZgIYJa3o” frameborder=”0″ allowfullscreen></iframe>というリンクと<iframe src=”http://www.youtube.com/embed/6CKZgIYJa3o” frameborder=”0″ allowfullscreen></iframe>というリンクです。 どちらのURLでもちゃんと変換できました。 ばっちぐーです。 4.サイトに乗せる CSSでプレイヤーのサイズを統一したいので<iframe>を<div>要素で囲みました。 そして猫のYouTubed動画を100個集めました。 そんでもって「今日の猫動画」なるものを作成しました。 ⇒ […]

View More

By Hoshino

0

UITableViewとかUICollectionViewとかがズレるとき

暖かいです。もうすっかり春です。だから今日は服を着ないで過ごそうと思います。 さて、iPhoneアプリを作ろうとキーボード(あっきぃの数少ない友だち)を叩いているとこんなエラーが。 the behavior of the UICollectionViewFlowLayout is not defined because: the item height must be less than the height of the UICollectionView minus the section insets top and bottom values. 出ました。英語です。 (誰か早く関西弁でエラーを吐き出すプラグインを作ってください。) どんな意味か知りませんが、 「UICollectionViewのアイテムの高さというか座標というかなんかそんな感じのがUICollectionViewの高さより小さいよ。クズめ。」 みたいなニュアンスだと思います。 状況としては、UINavigationBarが非表示のViewControllerから、UINavigationBarが表示されているViewController遷移する感じのところにUICollectionViewがあるって感じ。 あーこれはUINavigationBarの表示&非表示でScrollView系のInsetsが自動で変更してくれるような機能が備わっているのではないだろうか。そしてあっきぃに生きる資格はほぼ無いのではないだろうか。 との予想の下、調べてみるとこんなプロパティがUIViewControllerあるのでした。 @property(nonatomic,assign) BOOL automaticallyAdjustsScrollViewInsets NS_AVAILABLE_IOS(7_0); // Defaults to YES このautomaticallyAdjustsScrollViewInsetsの値がデフォルトでYESなので、 きっといいタイミングでNOにすればいいのです。 とりあえずインスタンス生成時に変更しておけばいいだろうとそのUIViewControllerにこんな記述を追加。 -(instancetype)init{        self = [super init];        if(self) {                self.automaticallyAdjustsScrollViewInsets = NO;        }        return self;} 結果は… 治った。 ScrollView系がズレるのは他にも色々原因があると思うので、参考の1つとしてお考えくださいまし。 ではでは。

View More

By Hoshino

0

背面が透明な手帳型iPhoneケース「Cellularline Clear Book」

公開: 2015-03-02 01:05更新: 2016-04-29 06:02 大人で素敵なiPhoneケースを扱うブランド「Cellularline(セルラーライン)」から面白い手帳型のiPhoneケースが登場しました。 「Clear Book」という名のiPhoneケース。 ありそうでなかった背面が透明の手帳型iPhoneケースです。 おかげでリンゴマークが生きます。 またカードも入るので、通勤、通学にも生きます。 カラーラインナップはiPhone6/6+のスペースグレイ、ゴールド、シルバーに似合う3色。 iPhoneのデザインを生かしつつ手帳タイプが使いたいあなたにピッタリのケースです。 ⇒ Cellularline iPhone6/iPhone6 Plus ケース 手帳型 CLEAR BOOK for iPhone6(4.7)/iPhone6 Plus(5.5) 【スリムデザイン】(Amazonへ)

View More

By Hoshino

0

iOS8 スクロールするとリサイズイベントが呼ばれるので

こんにちは、あっきぃです。 最近少し暖かくなってきた気がします。 そして北の国からのストーリーがよく分からないです。 さて、iOS8でスクロールすると何故かリサイズイベントが呼ばれてしまいます。 Safariのヘッダーが引っ込んだり、出て来たりした時に呼ばれる仕様になったようです。 作業していたアプリは、リサイズ時にCanavasでゴリゴリ図を描く処理を走らせていたので少し厄介。 そんな訳でこうしました。 var windowWidth = $(window).width();$(window).resize(function(){        var ww = $(window).width();        if(windowWidth != ww) {                 //リサイズ時に実行する処理                 windowWidth = ww;        }}); 横幅が変わった場合に呼ぶようにしました。 これで安心。

View More

By Hoshino

二本足の椅子「Inactivity」 – あぷすた

2本足の椅子「Inactivity」 足りない足は自分の足で補います。 作成したのはフランス生まれのデザイナー「Benoit Malta」 1990年生まれと、意外と若い。 動画もあります。 ⇒ – Inactivité – part I – Benoit Malta

View More