首页 文章 精选 留言 我的

【比你想的简单很多！从0开始完成一款App】8.构建主页(1)

2016-12-05 463

个人博客CoorChice，https://chenbingx.github.io/ ，最新文章将会首发CoorChice的博客，欢迎探索哦 !
同时，搜索CoorChice关注我的微信公众号，同期文章也将会优先推送到公众号中，以提醒您有新鲜文章出炉。亦可在文章末尾扫描二维码关注。

img_c3845efbded49b71398d8cc95503e8f7.png
封面.jpg

本系列文章列表

截止上一篇，我们已经完成了欢迎页，并且成功的请求到了定位地点的天气数据，并且缓存起来。本篇我们将开始构建我们的核心主页，它用于展示天气数据。

主页需求

  • 能够展示未来几天的天气；
  • 能够展示当日的详细天气情况；
  • 能够展示多地天气。

暂时先这几条，我们后面还可以再添加。现在我们开始着手实现这几个需求。

实现需求

根据以上需求，我们不但需要展示一天的详细数据和未来几天的天气数据，还要具备展示多地天气数据。所以大概可以设计一下，使用列表控件 来展示一个地区的详细数据，使用ViewPager 来展示不同地区的详细数据。话不多说，来看看这样的效果图。

img_1f13c3c642253ddaad97b666b83db499.gif
效果图

主要xml文件

这个页面很简单，它由Activity和Fragment构成。Fragments被放到了ViewPager中。
下面来看看各个布局文件。

Activity.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:tools="http://schemas.android.com/tools"
  android:id="@+id/activity_main"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:background="@color/themeBlueDeep"
  android:clipChildren="false"
  android:gravity="center"
  tools:background="@color/themeBlueDeep"
  tools:context="com.chenbing.oneweather.View.activitys.MainActivity"
  >

//用来容纳Fragment
  <android.support.v4.view.ViewPager
    android:id="@+id/pager_container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_above="@+id/bottom_opration"
    android:layout_alignParentStart="true"
    android:background="@color/transparent"
    tools:background="@color/opacity_7_white"
    />


//后期会在底部添加操作栏，所以先留出位置。
  <RelativeLayout
    android:id="@+id/bottom_opration"
    android:layout_width="match_parent"
    android:layout_height="46dp"
    android:background="@color/transparent"
    tools:background="@color/opacity_5_red"
    android:layout_alignParentBottom="true"
    android:layout_alignParentStart="true">

    <include layout="@layout/line_white"/>


    <ImageView
      android:id="@+id/right_button"
      android:layout_width="wrap_content"
      android:layout_height="match_parent"
      android:padding="8dp"
      tools:src="@drawable/sun"
      />

    <LinearLayout
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:layout_toLeftOf="@+id/left_button"
      android:layout_toRightOf="@+id/right_button"
      >

    </LinearLayout>

    <ImageView
      android:id="@+id/left_button"
      android:layout_width="wrap_content"
      android:layout_height="match_parent"
      android:layout_alignParentRight="true"
      android:padding="8dp"
      tools:src="@drawable/sun"
      />
  </RelativeLayout>
</RelativeLayout>

Fragment.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:tools="http://schemas.android.com/tools"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  tools:background="@color/colorPrimary"
  >

  <LinearLayout android:id="@+id/header"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    >

    <TextView
      android:id="@+id/city_name"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:layout_marginTop="60dp"
      android:gravity="center"
      android:textColor="@color/white"
      android:textSize="35sp"
      tools:text="北京市"
      />

    <TextView
      android:id="@+id/weather_info"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:layout_marginTop="5dp"
      android:gravity="center"
      android:textColor="@color/white"
      android:textSize="14sp"
      tools:text="多云"
      />

    <TextView
      android:id="@+id/air_quality"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:layout_marginTop="2dp"
      android:gravity="center"
      android:textColor="@color/white"
      android:textSize="14sp"
      tools:text="空气质量：危害健康"
      />

    <TextView
      android:id="@+id/temperature"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:layout_marginTop="0dp"
      android:gravity="center_horizontal"
      android:textColor="@color/white"
      android:textSize="80sp"
      tools:text="3°"/>
  </LinearLayout>

//用来装未来天气数据和当日详细信息
  <android.support.v7.widget.RecyclerView
    android:id="@+id/recyclerView"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:clipToPadding="false"
    android:paddingTop="270dp"
    tools:listitem="@layout/item_future_weather_info"
    />
</FrameLayout>

Activity

这个Activity的结构和之前的欢迎页差不多。

View模块

首先创建MainActivity的接口。

public interface MainActivityView extends MvpView {

}

继承接口，创建Activity。

public class MainActivity extends BaseActivity implements MainActivityView {

  @BindView(R.id.pager_container)
  ViewPager pagerContainer;

  private MainActivityPresenterApi presenter;  //依赖Presenter的抽象
  private List<BaseFragment> fragments = new ArrayList<>(); //这个数组用来装每个地区的天气页面

  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    presenter = new MainActivityPresenter(this);
    ButterKnife.bind(this);
    initData();
    initView();
    addListener();
  }

  @Override
  protected void initData() {
    fragments.add(WeatherDetailFragment.newInstance(null));  //创建Fragment
    //这里之所以穿Null是因为我在后面处理时，把默认天气数据设置为定位地区的
  }

  @Override
  protected void initView() {
    setWindowProperties();
    //设置ViewPager的适配器
    pagerContainer.setAdapter(new FragmentPagerAdapter(getSupportFragmentManager()) {
      @Override
      public Fragment getItem(int position) {
        return fragments.get(position);
      }

      @Override
      public int getCount() {
        return fragments.size();
      }
    });

    pagerContainer.setPageTransformer(false, new ZoomOutPageTransformer());
  }

  private void setWindowProperties() {
    // 实现透明状态栏
    getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS
        | WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION);
    getWindow().setFormat(PixelFormat.TRANSPARENT);
  }

  @Override
  protected void addListener() {

  }

  @Override
  protected BasePresenter getPresenter() {
    return presenter;
  }
}

Presenter模块

由于目前Activity本身并不处理什么任务，所以Presenter中还没内容，但是我们任然要按照架构写，因为后面可能会添加东西进去。

//Presenter接口
public interface MainActivityPresenterApi extends BasePresenter {

}

//Presenter实现，因为暂时不处理事物，所以先不写Model了
public class MainActivityPresenter implements MainActivityPresenterApi {

  private MainActivityView view;

  public MainActivityPresenter(MainActivityView view) {
    this.view = view;
  }

  @Override
  public void destroy() {
    view = null;
  }
}

Fragment

上面代码中可以看到，我们已经创建了一个Fragment，下面就来看看这个Fragment是什么样的。
Fragment同样需要按照MVP模式来，首先需要改造一下BaseFragment。

public abstract class BaseFragment extends Fragment {

  abstract protected void initData();

  abstract protected void initView();

  abstract protected void addListener();

  /**
   * 创建Presenter后必须重写这个方法，将其作为返回值
   */
  abstract protected BasePresenter getPresenter();

  @Override
  public void onViewCreated(View view, @Nullable Bundle savedInstanceState) {
    super.onViewCreated(view, savedInstanceState);
    view.setClickable(true);  //这个操作是为了防止Fragment出现点透Bug
  }

  @Override
  public void onDestroyView() {
    super.onDestroyView();
    if (getPresenter() != null){
      getPresenter().destroy(); //销毁Presenter，避免Activity对象因被Presenter持有而不能被销毁
    }
  }
}

View模块

Fragment的接口。

public interface WeatherDetailFragmentView extends MvpView {

  void onWeatherDataUpdate(WeatherData data);  //通知View更新数据，这个方法供Presenter调用
}

实现Fragment，包含了交互操作。

public class WeatherDetailFragment extends BaseFragment implements WeatherDetailFragmentView {

  public static final String CITY_NAME = "city_name";

  @BindView(R.id.header)
  ViewGroup header;
  @BindView(R.id.city_name)
  TextView cityName;
  @BindView(R.id.weather_info)
  TextView weatherInfo;
  @BindView(R.id.air_quality)
  TextView airQuality;
  @BindView(R.id.temperature)
  TextView temperature;
  @BindView(R.id.recyclerView)
  RecyclerView recyclerView;

  private WeatherDetailFragmentPresenterApi presenter; //依赖Presenter的抽象
  private WeatherData data;
  private FutureWeathersAdapter adapter;
  private int totalDy;
  private int alphaReferenceValue;


  public static BaseFragment newInstance(String cityName) {  //用静态方法创建Fragment
    WeatherDetailFragment instance = new WeatherDetailFragment();
    Bundle args = new Bundle();
    args.putString(CITY_NAME, cityName);  //储存需要显示的地区名字在Fragment的Argument中
    instance.setArguments(args);
    return instance;
  }

  @Nullable
  @Override
  public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container,
      @Nullable Bundle savedInstanceState) {
    View rootView = inflater.inflate(R.layout.fragment_weather_detail, container, false);
    ButterKnife.bind(this, rootView);
    presenter = new WeatherDetailFragmentPresenter(this);  //创建Fragment的Presenter
    initData();
    initView();
    addListener();
    return rootView;
  }

  @Override
  protected void initData() {
    String cityName = getArguments().getString(CITY_NAME);
    presenter.getWeatherData(cityName);  //请求天气数据
  }

  @Override
  protected void initView() {
    //看上面效果图，我们只需要使用LinearLayoutManager就可以了
    recyclerView.setLayoutManager(
        new LinearLayoutManager(getActivity(), LinearLayoutManager.VERTICAL, false));
    recyclerView.setItemAnimator(new DefaultItemAnimator());
  }



  @Override
  protected void addListener() {
    listenRecyclerView();
    temperature.getViewTreeObserver()
        .addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
          @Override
          public void onGlobalLayout() {
            computeAlphaReferenceValue();
            temperature.getViewTreeObserver().removeOnGlobalLayoutListener(this);
          }
        });
  }

  private void computeAlphaReferenceValue() {
    //下面是在计算设置温度TextView的Alpha值的参考值，效果是在RecyclerView的第一个Item滑动到温度TextView的1/8时，温度TextView刚好完全透明
    int temperatureY = temperature.getBottom();
    int temperatureHeight = temperature.getMeasuredHeight();
    int recyclerViewPaddingTop = recyclerView.getPaddingTop();
    alphaReferenceValue = recyclerViewPaddingTop - temperatureY + temperatureHeight / 8;
  }

  private void listenRecyclerView() {
    recyclerView.addOnScrollListener(new RecyclerView.OnScrollListener() {
      @Override
      public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
        totalDy -= dy;  //记录RecyclerView滑动的距离，上滑为负，下滑为正

        float translationY = (float) (totalDy * 0.3);  //取滑动距离的30%来移动上半部分View才能造成层次感
        header.setTranslationY(translationY);  //设置整个上半部分View的TranslationY，实现图中的滑动效果。  
        //translationY初始值为0，负值向上移动，正值向下移动，与Android坐标系的方向是一致的

        float alpha = 1 - (float) (Math.abs(totalDy * 0.3)) / alphaReferenceValue;
        temperature.setAlpha(alpha);  //设置Alpha值
        super.onScrolled(recyclerView, dx, dy);
      }
    });
  }

  @Override
  protected BasePresenter getPresenter() {
    return presenter;
  }

  @Override
  public void onWeatherDataUpdate(WeatherData data) {
    if (data != null) {
      updateView(data.getData());  
    }
  }

  private void updateView(WeatherData.Data data) {
    setHeaderView(data);
    setRecyclerView(data);
  }

  private void setHeaderView(WeatherData.Data data) {
    String cityName = data.getRealtime().getCity_name();
    this.cityName.setText(cityName);

    String weatherInfo = data.getRealtime().getWeather().getInfo();
    this.weatherInfo.setText(weatherInfo);

    String airQualityStrFormat = getString(R.string.air_quality);
    String airQuality = String.format(airQualityStrFormat, data.getPm25().getPm25().getQuality());
    this.airQuality.setText(airQuality);

    String temperatureFormat = getString(R.string.temperature);
    String temperature =
        String.format(temperatureFormat, data.getRealtime().getWeather().getTemperature());
    this.temperature.setText(temperature);
  }

  private void setRecyclerView(WeatherData.Data data) {
    if (data == null) {
      return;
    }
    if (adapter == null) {
      recyclerView.setAdapter(new FutureWeathersAdapter(getActivity(), data));  //在这里才创建RecyclerView的Adapter
    } else {
      adapter.updateData(data);
    }
  }
}

由于篇幅问题，本篇先讲到这。后面的文章中我们在一起完成Fragment的Presenter、Model，以及编写RecyclerView的Adapter。
本项目已上传至GitHub，详细源码请到GitHub查看。

项目地址GitHub

截止上一篇，我们已经完成了欢迎页，并且成功的请求到了定位地点的天气数据，并且缓存起来。本篇我们将开始构建我们的核心主页，它用于展示天气数据。

主页需求

  • 能够展示未来几天的天气；
  • 能够展示当日的详细天气情况；
  • 能够展示多地天气。

暂时先这几条，我们后面还可以再添加。现在我们开始着手实现这几个需求。

实现需求

根据以上需求，我们不但需要展示一天的详细数据和未来几天的天气数据，还要具备展示多地天气数据。所以大概可以设计一下，使用列表控件 来展示一个地区的详细数据，使用ViewPager 来展示不同地区的详细数据。话不多说，来看看这样的效果图。

img_1f13c3c642253ddaad97b666b83db499.gif
效果图

主要xml文件

这个页面很简单，它由Activity和Fragment构成。Fragments被放到了ViewPager中。
下面来看看各个布局文件。

Activity.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:tools="http://schemas.android.com/tools"
  android:id="@+id/activity_main"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:background="@color/themeBlueDeep"
  android:clipChildren="false"
  android:gravity="center"
  tools:background="@color/themeBlueDeep"
  tools:context="com.chenbing.oneweather.View.activitys.MainActivity"
  >

//用来容纳Fragment
  <android.support.v4.view.ViewPager
    android:id="@+id/pager_container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_above="@+id/bottom_opration"
    android:layout_alignParentStart="true"
    android:background="@color/transparent"
    tools:background="@color/opacity_7_white"
    />


//后期会在底部添加操作栏，所以先留出位置。
  <RelativeLayout
    android:id="@+id/bottom_opration"
    android:layout_width="match_parent"
    android:layout_height="46dp"
    android:background="@color/transparent"
    tools:background="@color/opacity_5_red"
    android:layout_alignParentBottom="true"
    android:layout_alignParentStart="true">

    <include layout="@layout/line_white"/>


    <ImageView
      android:id="@+id/right_button"
      android:layout_width="wrap_content"
      android:layout_height="match_parent"
      android:padding="8dp"
      tools:src="@drawable/sun"
      />

    <LinearLayout
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:layout_toLeftOf="@+id/left_button"
      android:layout_toRightOf="@+id/right_button"
      >

    </LinearLayout>

    <ImageView
      android:id="@+id/left_button"
      android:layout_width="wrap_content"
      android:layout_height="match_parent"
      android:layout_alignParentRight="true"
      android:padding="8dp"
      tools:src="@drawable/sun"
      />
  </RelativeLayout>
</RelativeLayout>

Fragment.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:tools="http://schemas.android.com/tools"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  tools:background="@color/colorPrimary"
  >

  <LinearLayout android:id="@+id/header"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    >

    <TextView
      android:id="@+id/city_name"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:layout_marginTop="60dp"
      android:gravity="center"
      android:textColor="@color/white"
      android:textSize="35sp"
      tools:text="北京市"
      />

    <TextView
      android:id="@+id/weather_info"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:layout_marginTop="5dp"
      android:gravity="center"
      android:textColor="@color/white"
      android:textSize="14sp"
      tools:text="多云"
      />

    <TextView
      android:id="@+id/air_quality"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:layout_marginTop="2dp"
      android:gravity="center"
      android:textColor="@color/white"
      android:textSize="14sp"
      tools:text="空气质量：危害健康"
      />

    <TextView
      android:id="@+id/temperature"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:layout_marginTop="0dp"
      android:gravity="center_horizontal"
      android:textColor="@color/white"
      android:textSize="80sp"
      tools:text="3°"/>
  </LinearLayout>

//用来装未来天气数据和当日详细信息
  <android.support.v7.widget.RecyclerView
    android:id="@+id/recyclerView"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:clipToPadding="false"
    android:paddingTop="270dp"
    tools:listitem="@layout/item_future_weather_info"
    />
</FrameLayout>

Activity

这个Activity的结构和之前的欢迎页差不多。

View模块

首先创建MainActivity的接口。

public interface MainActivityView extends MvpView {

}

继承接口，创建Activity。

public class MainActivity extends BaseActivity implements MainActivityView {

  @BindView(R.id.pager_container)
  ViewPager pagerContainer;

  private MainActivityPresenterApi presenter;  //依赖Presenter的抽象
  private List<BaseFragment> fragments = new ArrayList<>(); //这个数组用来装每个地区的天气页面

  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    presenter = new MainActivityPresenter(this);
    ButterKnife.bind(this);
    initData();
    initView();
    addListener();
  }

  @Override
  protected void initData() {
    fragments.add(WeatherDetailFragment.newInstance(null));  //创建Fragment
    //这里之所以穿Null是因为我在后面处理时，把默认天气数据设置为定位地区的
  }

  @Override
  protected void initView() {
    setWindowProperties();
    //设置ViewPager的适配器
    pagerContainer.setAdapter(new FragmentPagerAdapter(getSupportFragmentManager()) {
      @Override
      public Fragment getItem(int position) {
        return fragments.get(position);
      }

      @Override
      public int getCount() {
        return fragments.size();
      }
    });

    pagerContainer.setPageTransformer(false, new ZoomOutPageTransformer());
  }

  private void setWindowProperties() {
    // 实现透明状态栏
    getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS
        | WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION);
    getWindow().setFormat(PixelFormat.TRANSPARENT);
  }

  @Override
  protected void addListener() {

  }

  @Override
  protected BasePresenter getPresenter() {
    return presenter;
  }
}

Presenter模块

由于目前Activity本身并不处理什么任务，所以Presenter中还没内容，但是我们任然要按照架构写，因为后面可能会添加东西进去。

//Presenter接口
public interface MainActivityPresenterApi extends BasePresenter {

}

//Presenter实现，因为暂时不处理事物，所以先不写Model了
public class MainActivityPresenter implements MainActivityPresenterApi {

  private MainActivityView view;

  public MainActivityPresenter(MainActivityView view) {
    this.view = view;
  }

  @Override
  public void destroy() {
    view = null;
  }
}

Fragment

上面代码中可以看到，我们已经创建了一个Fragment，下面就来看看这个Fragment是什么样的。
Fragment同样需要按照MVP模式来，首先需要改造一下BaseFragment。

public abstract class BaseFragment extends Fragment {

  abstract protected void initData();

  abstract protected void initView();

  abstract protected void addListener();

  /**
   * 创建Presenter后必须重写这个方法，将其作为返回值
   */
  abstract protected BasePresenter getPresenter();

  @Override
  public void onViewCreated(View view, @Nullable Bundle savedInstanceState) {
    super.onViewCreated(view, savedInstanceState);
    view.setClickable(true);  //这个操作是为了防止Fragment出现点透Bug
  }

  @Override
  public void onDestroyView() {
    super.onDestroyView();
    if (getPresenter() != null){
      getPresenter().destroy(); //销毁Presenter，避免Activity对象因被Presenter持有而不能被销毁
    }
  }
}

View模块

Fragment的接口。

public interface WeatherDetailFragmentView extends MvpView {

  void onWeatherDataUpdate(WeatherData data);  //通知View更新数据，这个方法供Presenter调用
}

实现Fragment，包含了交互操作。

public class WeatherDetailFragment extends BaseFragment implements WeatherDetailFragmentView {

  public static final String CITY_NAME = "city_name";

  @BindView(R.id.header)
  ViewGroup header;
  @BindView(R.id.city_name)
  TextView cityName;
  @BindView(R.id.weather_info)
  TextView weatherInfo;
  @BindView(R.id.air_quality)
  TextView airQuality;
  @BindView(R.id.temperature)
  TextView temperature;
  @BindView(R.id.recyclerView)
  RecyclerView recyclerView;

  private WeatherDetailFragmentPresenterApi presenter; //依赖Presenter的抽象
  private WeatherData data;
  private FutureWeathersAdapter adapter;
  private int totalDy;
  private int alphaReferenceValue;


  public static BaseFragment newInstance(String cityName) {  //用静态方法创建Fragment
    WeatherDetailFragment instance = new WeatherDetailFragment();
    Bundle args = new Bundle();
    args.putString(CITY_NAME, cityName);  //储存需要显示的地区名字在Fragment的Argument中
    instance.setArguments(args);
    return instance;
  }

  @Nullable
  @Override
  public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container,
      @Nullable Bundle savedInstanceState) {
    View rootView = inflater.inflate(R.layout.fragment_weather_detail, container, false);
    ButterKnife.bind(this, rootView);
    presenter = new WeatherDetailFragmentPresenter(this);  //创建Fragment的Presenter
    initData();
    initView();
    addListener();
    return rootView;
  }

  @Override
  protected void initData() {
    String cityName = getArguments().getString(CITY_NAME);
    presenter.getWeatherData(cityName);  //请求天气数据
  }

  @Override
  protected void initView() {
    //看上面效果图，我们只需要使用LinearLayoutManager就可以了
    recyclerView.setLayoutManager(
        new LinearLayoutManager(getActivity(), LinearLayoutManager.VERTICAL, false));
    recyclerView.setItemAnimator(new DefaultItemAnimator());
  }



  @Override
  protected void addListener() {
    listenRecyclerView();
    temperature.getViewTreeObserver()
        .addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
          @Override
          public void onGlobalLayout() {
            computeAlphaReferenceValue();
            temperature.getViewTreeObserver().removeOnGlobalLayoutListener(this);
          }
        });
  }

  private void computeAlphaReferenceValue() {
    //下面是在计算设置温度TextView的Alpha值的参考值，效果是在RecyclerView的第一个Item滑动到温度TextView的1/8时，温度TextView刚好完全透明
    int temperatureY = temperature.getBottom();
    int temperatureHeight = temperature.getMeasuredHeight();
    int recyclerViewPaddingTop = recyclerView.getPaddingTop();
    alphaReferenceValue = recyclerViewPaddingTop - temperatureY + temperatureHeight / 8;
  }

  private void listenRecyclerView() {
    recyclerView.addOnScrollListener(new RecyclerView.OnScrollListener() {
      @Override
      public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
        totalDy -= dy;  //记录RecyclerView滑动的距离，上滑为负，下滑为正

        float translationY = (float) (totalDy * 0.3);  //取滑动距离的30%来移动上半部分View才能造成层次感
        header.setTranslationY(translationY);  //设置整个上半部分View的TranslationY，实现图中的滑动效果。  
        //translationY初始值为0，负值向上移动，正值向下移动，与Android坐标系的方向是一致的

        float alpha = 1 - (float) (Math.abs(totalDy * 0.3)) / alphaReferenceValue;
        temperature.setAlpha(alpha);  //设置Alpha值
        super.onScrolled(recyclerView, dx, dy);
      }
    });
  }

  @Override
  protected BasePresenter getPresenter() {
    return presenter;
  }

  @Override
  public void onWeatherDataUpdate(WeatherData data) {
    if (data != null) {
      updateView(data.getData());  
    }
  }

  private void updateView(WeatherData.Data data) {
    setHeaderView(data);
    setRecyclerView(data);
  }

  private void setHeaderView(WeatherData.Data data) {
    String cityName = data.getRealtime().getCity_name();
    this.cityName.setText(cityName);

    String weatherInfo = data.getRealtime().getWeather().getInfo();
    this.weatherInfo.setText(weatherInfo);

    String airQualityStrFormat = getString(R.string.air_quality);
    String airQuality = String.format(airQualityStrFormat, data.getPm25().getPm25().getQuality());
    this.airQuality.setText(airQuality);

    String temperatureFormat = getString(R.string.temperature);
    String temperature =
        String.format(temperatureFormat, data.getRealtime().getWeather().getTemperature());
    this.temperature.setText(temperature);
  }

  private void setRecyclerView(WeatherData.Data data) {
    if (data == null) {
      return;
    }
    if (adapter == null) {
      recyclerView.setAdapter(new FutureWeathersAdapter(getActivity(), data));  //在这里才创建RecyclerView的Adapter
    } else {
      adapter.updateData(data);
    }
  }
}

由于篇幅问题，本篇先讲到这。后面的文章中我们在一起完成Fragment的Presenter、Model，以及编写RecyclerView的Adapter。
本项目已上传至GitHub，详细源码请到GitHub查看。

项目地址GitHub

img_08b056b059ac831a2d371fa29bdef1e3.jpe
CoorChice的公众号
上一篇 下一篇
优秀的个人博客,低调大师

微信关注我们

原文链接：https://yq.aliyun.com/articles/656861

转载内容版权归作者及来源网站所有！

低调大师中文资讯倾力打造互联网数据资讯、行业资源、电子商务、移动互联网、网络营销平台。持续更新报道IT业界、互联网、市场资讯、驱动更新,是最及时权威的产业资讯及硬件资讯报道平台。

Android 5.0 到 Android 6.0 + 的深坑之一 之 .so 动态库的适配

(原创：http://www.cnblogs.com/linguanh) 目录： 前序 一，问题描述 二，为何会如此"无情"? 三，目前存在该问题的知名SDK 四，解决方案，1 对 N 前序： 嫌无聊的请跳过。上次发博文是同年8月，时光荏苒，空闲时间少，现在都接近年关了，其实这4个月学了很多，接触了IM(非第三方)，学习了 golang 并采用它成功完成仿朋友圈页面的服务端api，等等..等等..，由于这个问题的确是业界超级"毒瘤"，趁午休时间，尽我程序员的"干货"思维，少废话，尽通俗。 码字发文。 一，问题描述 先简单阐述下几个概念，这些不是重点。 1，Android 编译时候的 api 版本，指的是你要生成的这个 apk 所依赖的 sdk 版本，例如 api 23 即是 Android 6.0 ； 2，.so 动态链接库，为 Linux 下的库文件，Windows 是 .dll，Android 是基于 Linux 内核的，所以使用的是 .so，在安卓上面，一般由 C/C++ 语言进行 Jni 编程后，采用 NDK 工具编译后所生成的，可以参考下我之前的一篇教程博文：htt...
2016-12-06
548
上一篇

Android,iso接口调试-抓包调试接口

准备工具 cmd 用于查看本机IP fiddler 抓包工具,fiddler应该算windows是最流行的,但是太丑了 charles 和fiddler相比,要好看一点,所以用这个做例子 前提:手机和电脑要在同一个局域网 第一步 首先获取本机IP地址 String ip = “192.168.1.166”; 点击修改网络 1.代理主机名 = ip (请输入你本机的ip) 2.代理服务器端口 = 8888(这个值可以自己设,见下文) 3.确认 第二步 charles的设置 打开设置后请按如下设置 第一图是给手机设置的 第二图给windows ….. 第三步 应该可以用了,如果还不行,请重新打开一下软件 注意: Structure是按照站点分类的,关于这个站点的都在这一个组(一般不看这个) Sequence是按时间顺序来的,我一般都是看这个 结束: 其实只是简单的教大家怎么用软件我觉得….. 关于请求数据,返回数据的查看,自行研究吧,最好先看看http请求的相关知识
2016-12-06
686
下一篇

相关文章

发表评论

资源下载

更多资源
优质分享App

优质分享App

近一个月的开发和优化，本站点的第一个app全新上线。该app采用极致压缩，本体才4.36MB。系统里面做了大量数据访问、缓存优化。方便用户在手机上查看文章。后续会推出HarmonyOS的适配版本。

时间: 2025-12-03 大小: 4.36MB 下载: 23次
Mario

Mario

马里奥是站在游戏界顶峰的超人气多面角色。马里奥靠吃蘑菇成长，特征是大鼻子、头戴帽子、身穿背带裤，还留着胡子。与他的双胞胎兄弟路易基一起，长年担任任天堂的招牌角色。

时间: 2025-12-12 大小: 211.28KB 下载: 54次
Spring

Spring

Spring框架（Spring Framework）是由Rod Johnson于2002年提出的开源Java企业级应用框架，旨在通过使用JavaBean替代传统EJB实现方式降低企业级编程开发的复杂性。该框架基于简单性、可测试性和松耦合性设计理念，提供核心容器、应用上下文、数据访问集成等模块，支持整合Hibernate、Struts等第三方框架，其适用范围不仅限于服务器端开发，绝大多数Java应用均可从中受益。

时间: 2025-12-17 大小: 5MB 下载: 1次
Sublime Text

Sublime Text

Sublime Text具有漂亮的用户界面和强大的功能，例如代码缩略图，Python的插件，代码段等。还可自定义键绑定，菜单和工具栏。Sublime Text 的主要功能包括：拼写检查，书签，完整的 Python API ， Goto 功能，即时项目切换，多选择，多窗口等等。Sublime Text 是一个跨平台的编辑器，同时支持Windows、Linux、Mac OS X等操作系统。

时间: 2025-12-03 大小: 9.84MB 下载: 39次
手机查看

扫码在手机上查看文章

扫描二维码，手机阅读更方便

热门标签
Service Mesh OpenAi DeepSeek SpringCloud Jdk25 Rocky HarmonyOS6 Docker Nacos3 Kubernetes Redis Gemini3 SpringBoot4

欢迎您来访！

登录后，您将获得更多功能！
热门文章
联系我们

有任何问题或合作意向欢迎联系我们

Email: 99873273@qq.com

QQ: 99873273

用户登录
用户注册