Donate to e Foundation | Murena handsets with /e/OS | Own a part of Murena! Learn more

Commit 4d4b599d authored by Ricardo Cervera's avatar Ricardo Cervera Committed by Android Git Automerger
Browse files

am ac4444a2: am c5fae959: am 48a066db: am 60cfb01a: Merge "docs: Update... 

am ac4444a2: am c5fae959: am 48a066db: am 60cfb01a: Merge "docs: Update wearable lists docs" into lmp-docs

* commit 'ac4444a2':
  docs: Update wearable lists docs
parents bea6f1e6 ac4444a2

docs/html/training/wearables/ui/lists.jd

+17 −34
Original line number Original line Diff line number Diff line
@@ -82,20 +82,21 @@ the list is displayed properly on both round and square devices:</p> 
<p>In many cases, each list item consists of an icon and a description. The

<p>In many cases, each list item consists of an icon and a description. The

<em>Notifications</em> sample from the Android SDK implements a custom layout that extends

<em>Notifications</em> sample from the Android SDK implements a custom layout that extends

{@link android.widget.LinearLayout} to incorporate these two elements inside each list item.

{@link android.widget.LinearLayout} to incorporate these two elements inside each list item.

This layout also implements the methods in the <code>WearableListView.Item</code> interface

This layout also implements the methods in the

to animate the item's icon and fade the text in response to events from

<code>WearableListView.OnCenterProximityListener</code> interface

to change the color of the item's icon and fade the text in response to events from

<code>WearableListView</code> as the user scrolls through the list.</p>

<code>WearableListView</code> as the user scrolls through the list.</p>





<pre>

<pre>

public class WearableListItemLayout extends LinearLayout

public class WearableListItemLayout extends LinearLayout

                                    implements WearableListView.Item {

             implements WearableListView.OnCenterProximityListener {



    private ImageView mCircle;

    private TextView mName;





    private final float mFadedTextAlpha;

    private final float mFadedTextAlpha;

    private final int mFadedCircleColor;

    private final int mFadedCircleColor;

    private final int mChosenCircleColor;

    private final int mChosenCircleColor;

    private ImageView mCircle;

    private float mScale;

    private TextView mName;





    public WearableListItemLayout(Context context) {

    public WearableListItemLayout(Context context) {

        this(context, null);

        this(context, null);
@@ -108,6 +109,7 @@ public class WearableListItemLayout extends LinearLayout 
    public WearableListItemLayout(Context context, AttributeSet attrs,

    public WearableListItemLayout(Context context, AttributeSet attrs,

                                  int defStyle) {

                                  int defStyle) {

        super(context, attrs, defStyle);

        super(context, attrs, defStyle);



        mFadedTextAlpha = getResources()

        mFadedTextAlpha = getResources()

                         .getInteger(R.integer.action_text_faded_alpha) / 100f;

                         .getInteger(R.integer.action_text_faded_alpha) / 100f;

        mFadedCircleColor = getResources().getColor(R.color.grey);

        mFadedCircleColor = getResources().getColor(R.color.grey);
@@ -124,46 +126,27 @@ public class WearableListItemLayout extends LinearLayout 
        mName = (TextView) findViewById(R.id.name);

        mName = (TextView) findViewById(R.id.name);

    }

    }





    // Provide scaling values for WearableListView animations

    &#64;Override

    &#64;Override

    public float getProximityMinValue() {

    public void onCenterPosition(boolean animate) {

        return 1f;

    }



    &#64;Override

    public float getProximityMaxValue() {

        return 1.6f;

    }



    &#64;Override

    public float getCurrentProximityValue() {

        return mScale;

    }



    // Scale the icon for WearableListView animations

    &#64;Override

    public void setScalingAnimatorValue(float scale) {

        mScale = scale;

        mCircle.setScaleX(scale);

        mCircle.setScaleY(scale);

    }



    // Change color of the icon, remove fading from the text

    &#64;Override

    public void onScaleUpStart() {

        mName.setAlpha(1f);

        mName.setAlpha(1f);

        ((GradientDrawable) mCircle.getDrawable()).setColor(mChosenCircleColor);

        ((GradientDrawable) mCircle.getDrawable()).setColor(mChosenCircleColor);

    }

    }





    // Change the color of the icon, fade the text

    &#64;Override

    &#64;Override

    public void onScaleDownStart() {

    public void onNonCenterPosition(boolean animate) {

        ((GradientDrawable) mCircle.getDrawable()).setColor(mFadedCircleColor);

        ((GradientDrawable) mCircle.getDrawable()).setColor(mFadedCircleColor);

        mName.setAlpha(mFadedTextAlpha);

        mName.setAlpha(mFadedTextAlpha);

    }

    }

}

}

</pre>

</pre>





<p>You can also create animator objects to enlarge the icon of the center item in the list. You can

use the <code>onCenterPosition()</code> and <code>onNonCenterPosition()</code> callback methods

in the <code>WearableListView.OnCenterProximityListener</code> interface to manage your

animators. For more information about animators, see

<a href="{@docRoot}guide/topics/graphics/prop-animation.html#object-animator">Animating with

ObjectAnimator</a>.</p>







<h2 id="layout-def">Create a Layout Definition for Items</h2>

<h2 id="layout-def">Create a Layout Definition for Items</h2>