RailsでWEBアプリを作って海外移住

30歳にしてサラリーマンをリタイア、WEBの世界で、ご飯を食べて、海外移住に挑戦

スマフォ画面でも、綺麗にwill_paginationをしてみた!

みなさんこんにちは!39の管理人ケンタリートです。いままで携帯画面で39のユーザ一覧をみると、気になっていたこの部分!

f:id:kentarito:20160519190432j:plain

82番まで表示されてもいらないよ!とか、3列も幅をとりすぎではないか?という不満が上がってきそうな予感がしていたので、今日はここを綺麗にしてみました。予定では1行で表示したかったんですけど、さがしてもさがしても、やり方がわからない。

最終的にこれで落ち着きました。

f:id:kentarito:20160519190614j:plain


今回考えた方法は、2つあります、一つは表示件数を制限する方法。この方法もいがいと初心者にはわからない。SQLでlimitを使ったりしているかもしれないんですが、実は下記のサイトにあるように, total_entriesを利用します。

@posts = Post.paginate(:page => params[:page], :per_page => 10, :total_entries => 100)

これで件数の制限ができますが、100番目以上の人はどうがんばっても表示されないので。却下しました。


stackoverflow.com


結局採用したのはこの方法。これは、Viewのページネーションの部分に直接書く方法です。

<%= will_paginate @yourwhatevers, inner_window: 3, outer_window: 1 %>


inner_windowの意味は、自分のいるページより前のページと後のページを何個表示するかです。

paginationの使い方を説明してあるページはたくさんあるのに、いがいとオプションを説明しているサイトはないですね!


====================

追加 2016/5/20


すこしでも短くしようと思って、思いついたのがfont-awesomeを利用する方法です。

<%= will_paginate @users, :previous_label => '<i class="fa fa-angle-double-left" aria-hidden="true"></i>', :next_label => '<i class="fa fa-angle-double-right" aria-hidden="true"></i>', inner_window: 1, outer_window: 1 %>

f:id:kentarito:20160520150402j:plain