Material Design--FloatingActionButton実戦

Material Design--FloatingActionButton(リリース)
コンフィギュレーション
Android studioインポートの使用Githubアドレス:futuresimple/android-floating-action-button
最初はどのように導入するか分からず、eclipseに同じように第三者のバッグを導入すればいいと思っていましたが、android studioがgradlesを使用しているとは思いもよらず、直接対応する位置に下の言葉を付け加えるだけで導入できました.
Just add the dependency to your build.gradle:

dependencies {
    compile 'com.getbase:floatingactionbutton:1.9.0'
}

次の操作を行います.
対応するレイアウトxmlに、追加します.
ルートレイアウトにはxmlns:fab="http://schemas.android.com/apk/res-auto"が追加され、カスタムフォーマットを使用することを指定します.
コントロールを追加するには

以上の設定で表示され、通常のbtnのように使用されます.あまり複雑に考えなくてもいいです.詳細については、githubの例を参照してください.
参考記事:FloatingActionButtonの使用
eclipse使用
最初から以上のgithubのすべてをダウンロードして、導入して、それから間違いを報告しました.インターネットで探しましたが、これが欠けているのではなく、それが欠けています.あきらめるしかない.そして以前はMaterial Deisgnが保存されていたGithubアドレスもあり、このfloat buttonもありました.さらにeclipse導入により、完全にエラーは報告されていません.次はこれを使います.gitubアドレス:navasmdc/MaterialDesign Library、プロジェクト全体をダウンロードし、インポートすればいい.
使用する項目が違うと、使用も少し違います.
ルートレイアウト:xmlns:materialdesign="http://schemas.android.com/apk/res-auto"コントロールの追加

ここにはアニメーションの効果も入っていて、nineoldandroids.jarで実現されたアニメーションの効果を使っていますが、私がなぜアニメーションの効果を使ったのか分かりません.だから、私のところはmaterialdesign:animate="false"で、使いません.FloatingActionsMenuを使用して複数のbuttonをポップアップFloatingActionMenuを使用して複数のfloatbuttonをネストすればよい

実戦
ポップアップテキストのフォント色とフォント背景を変更する方法
Alt text
フローティングメニューFloatingActionsMenuは、属性を提供します.fab:fab_labelStyle修正を行います.カスタムのインポートstyle

FloatingActionsMenuに

を追加

fab:fab_labelStyle="@style/menu_labels_style"

styles.xmlに追加(フォントとバックグラウンドの2つのスタイルを変更するだけ)

解決FloatingActionsMenuのアイコンは変更できません
大量の検索を経て、最も直接的なのは、Githubの中のissues問題で、作者が解決するのを待っています.発見の中で、問題56は問題を解決する構想を提供した.考えに沿って

まずソースコードをcloneにしなければなりません.

は次に、デフォルトのアイコンを見つけます.明らかに描かれています.クラスFloatingActionsMenuにおける方法createAddButtonにおける

 Drawable getIconDrawable() {
        final RotatingDrawable rotatingDrawable = new RotatingDrawable(super.getIconDrawable());
}

文字通りの理解からRotatingDrawableの回転資源はsuper.getIconDrawable()によって得られることが分かる.このクラスを見つけました:AddFloatingActionButton.

次にAddFloatingActionButtonを研究し、発見方法:getIconDrawable()はまさに

を画定した.

final Shape shape = new Shape() {
      @Override
      public void draw(Canvas canvas, Paint paint) {
        canvas.drawRect(plusOffset, iconHalfSize - plusHalfStroke, iconSize - plusOffset, iconHalfSize + plusHalfStroke, paint);
        canvas.drawRect(iconHalfSize - plusHalfStroke, plusOffset, iconHalfSize + plusHalfStroke, iconSize - plusOffset, paint);
      }
    };

Canvasで満たされた矩形を描く. 字になります.

で見つかった最初の感覚は、対応するクラスを継承し、対応するメソッドを書き換えることです.すなわち、getIconDrawable()の方法.しかし、原作者がpublicではなくデフォルトの修飾子を使用している以上、現在のパッケージのクラスだけがこの方法を書き換えることができ、解けず、自分でソースコードを修正するしかない.

現在のAddFloatingActionButtonにメソッドを追加します.私たちはcanvasを通じて画像を描きました.

public Drawable getBitmapDrawable(final int resIcon) {

  final Shape shape = new Shape() {
    @Override
    public void draw(Canvas canvas, Paint paint) {
      Bitmap iconbit = BitmapFactory.decodeResource(getResources(), resIcon) ;//       Bitmap
      canvas.drawBitmap(iconbit,0,0,paint);//  canvas    
    }
  };
  ShapeDrawable drawable = new ShapeDrawable(shape);

  final Paint paint = drawable.getPaint();
  paint.setColor(mPlusColor);
  paint.setStyle(Style.FILL);
  paint.setAntiAlias(true);

  return drawable;
}

クラスFloatingActionsMenuに属性を追加し、ピクチャのリソース

を専門に得る.

 private int mResIcon=-1;

その後、方法:getIconDrawable()を修正し、

final RotatingDrawable rotatingDrawable = new RotatingDrawable(super.getIconDrawable());

に改心

RotatingDrawable rotatingDrawable;
if(mResIcon!=-1){
  rotatingDrawable = new RotatingDrawable(getBitmapDrawable(mResIcon));
}
else{
  rotatingDrawable = new RotatingDrawable(super.getIconDrawable());
}

設定を行うmResIcon、デフォルトは ですが、アイコンがある場合は、変更します.

対応、xml対応のプロパティを提供する必要があります.res/values/attrs.xmlに

を追加します.

クラスFloatingActionsMenuの方法init(Context context, AttributeSet attributeSet)に

を加える.

mResIcon=attr.getResourceId(R.styleable.FloatingActionsMenu_fab_bitmap, -1);//      ，     -1

設定完了
カスタム修正FloatingActionsMenuの回転角度を解決
デフォルトは135です.

対応するxmlのプロパティを提供する必要がありますres/values/attrs.xml

を追加

は、クラスFloatingActionsMenuに以下の属性を加える、付与

を行う.

private static final float EXPANDED_PLUS_ROTATION = 90f + 45f;//rorate
private float rotate=EXPANDED_PLUS_ROTATION;//     

getまたはsetによって修正され、動的に修正することができる

public float getRotate() {
  return rotate;
}

public void setRotate(float rotate) {
  this.rotate = rotate;
}

クラスFloatingActionsMenuのinit()に

を追加する.

rotate=attr.getFloat(R.styleable.FloatingActionsMenu_fab_rotation,EXPANDED_PLUS_ROTATION);

最後にEXPANDED_PLUS_ROTATIONがあるところで、getRotate()に置き換えるとよい.

getIconDrawableの中にある

final ObjectAnimator collapseAnimator = ObjectAnimator.ofFloat(rotatingDrawable, "rotation", getRotate(), COLLAPSED_PLUS_ROTATION);
final ObjectAnimator expandAnimator = ObjectAnimator.ofFloat(rotatingDrawable, "rotation", COLLAPSED_PLUS_ROTATION, getRotate());

プロジェクトアドレス
私はすでにプロジェクトをforkし、提出し、原作者との合併を申請しました.アドレス:https://github.com/Trity93/android-floating-action-button
最新の自分で更新したプロジェクトアドレス:FloatingActionButton
学習資料
CircularFloatingActionMenuソースコード解析