将Tablayout和工具栏添加到屏幕顶部

时间:2016-04-15 06:25:50

标签: android android-layout material-design android-toolbar android-tablayout

我想为我的应用创建DeatailActivity.java import android.content.Intent; import android.support.design.widget.TabLayout; import android.support.v4.app.FragmentManager; import android.support.v4.view.ViewPager; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.support.v7.widget.Toolbar; import android.view.Menu; import android.view.MenuItem; import ir.dink.sevom.R; import ir.dink.sevom.adapters.*; public class DetailActivity extends AppCompatActivity { private ViewPager detailActivityViewPager; private TabLayout detailActivityTabLayout; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_detail); initToolbar(); initTablayout(); } //============================ Init Toolbar ===================================// private void initToolbar() { Toolbar mainToolbar = (Toolbar)findViewById(R.id.toolbar_detail_activity); setSupportActionBar(mainToolbar); getSupportActionBar().setDisplayShowTitleEnabled(false); getSupportActionBar().setDisplayHomeAsUpEnabled(true); } //========================== OnCreate Option Menu =====================================// @Override public boolean onCreateOptionsMenu(Menu menu) { getMenuInflater().inflate(R.menu.main, menu); return true; } //=============================== onOption Item Selected ================================// @Override public boolean onOptionsItemSelected(MenuItem item) { switch (item.getItemId()){ case R.id.search_action_toolbar: // startActivity(new Intent(MainActivity.this ,DetailActivity.class )); return true; default: return super.onOptionsItemSelected(item); } } private void initTablayout() { detailActivityViewPager = (ViewPager) findViewById(R.id.view_pager_detail_activity); detailActivityTabLayout = (TabLayout) findViewById(R.id.tab_layout_detail_activity); FragmentManager manager = getSupportFragmentManager(); DetailActivityPagerAdapter detailadapter = new DetailActivityPagerAdapter(manager); detailActivityViewPager.setAdapter(detailadapter); detailActivityViewPager.setCurrentItem(detailActivityViewPager.getAdapter().getCount() - 1); detailActivityTabLayout.setupWithViewPager(detailActivityViewPager); detailActivityViewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(detailActivityTabLayout)); } } 。我想要实现布局这样的事情。

enter image description here

查看绿色矩形。它包含工具栏和Tablayout。

当我们向下滚动和工具栏时触摸Tablayout。它们固定在屏幕的顶部。

我认为此布局使用Scroll和...并在活动中使用工具栏和Tablayout。

这是我的代码,我试图实现那个。但没有......

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="ir.dink.sevom.activities.DetailActivity">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar_detail_activity"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="@android:color/transparent"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"/>

    <ImageView
        android:id="@+id/img_detail"
        android:layout_width="96dp"
        android:layout_height="124dp"
        android:layout_below="@id/toolbar_detail_activity"
        android:src="@drawable/ic_hamburger"
        android:layout_alignParentRight="true"
        android:layout_margin="8dp"/>
    <TextView
        android:id="@+id/txt_name_detail"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:singleLine="true"
        android:text="نام :"
        android:layout_toLeftOf="@+id/img_detail"
        android:layout_alignTop="@+id/img_detail"/>
    <TextView
        android:id="@+id/txt_count_detail"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:singleLine="true"
        android:text="تعداد"
        android:layout_toLeftOf="@+id/img_detail"
        android:layout_below="@+id/txt_name_detail"
        android:layout_marginTop="8dp"/>

    <TextView
        android:id="@+id/txt_last_update_detail"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:singleLine="true"
        android:text="آخرین آپدیت"
        android:layout_toLeftOf="@+id/img_detail"
        android:layout_below="@+id/txt_count_detail"
        android:layout_marginTop="8dp"/>

    <android.support.design.widget.TabLayout
        android:id="@+id/tab_layout_detail_activity"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="#4d4d4d"
        android:layout_below="@id/img_detail"
        app:tabMode="scrollable"
        />

    <android.support.v4.view.ViewPager
        android:id="@+id/view_pager_detail_activity"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@+id/tab_layout_detail_activity"/>

</RelativeLayout>

这是那个Xml:

<div class="mc-image " title="The Bridges" style="background-image: url(image.jpg);" data-href="link.html"></div>
<div class="mc-image " title="The Bridges" style="background-image: url(image2.jpg);" data-href="link2.html"></div>

0 个答案:

没有答案