在 Android 中相互重叠的功能
Functions overlapping each other in Android
我正在构建一个 Android 应用程序,在我的 MainActivity 上有一个 "switch" 按钮,在它的正下方有一个包含三个不同选项卡的栏。
开关按钮可以在"on"和"off"中设置。这是我尝试做的第一件事,而且效果很好。但是在我添加这个带有选项卡的栏之后,切换按钮停止工作,它似乎在这个栏内有一些东西不允许切换工作。我是 Android 开发新手。
这是我的 MainActivity 代码:
如果我删除或评论下面“//Tabs”中的所有内容,开关将再次开始工作,否则它不会从打开变为关闭。
public class MainScreen extends AppCompatActivity{
Switch list_toggle;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main_screen);
final TextView textView4 = (TextView) findViewById(R.id.textView4);
textView4.setText(Html.fromHtml("Absent"));
list_toggle = (Switch) findViewById(R.id.mySwitch);
list_toggle.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
if (isChecked) {
textView4.setText(Html.fromHtml("Available"));
} else {
textView4.setText(Html.fromHtml("Absent"));
}
}
});
//Tabs
TabLayout tabLayout = (TabLayout) findViewById(R.id.tab_layout);
tabLayout.addTab(tabLayout.newTab().setText("Orders"));
tabLayout.addTab(tabLayout.newTab().setText("Past Orders"));
tabLayout.addTab(tabLayout.newTab().setText("More"));
tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);
final ViewPager viewPager = (ViewPager) findViewById(R.id.pager);
final PagerAdapter adapter = new PagerAdapter
(getSupportFragmentManager(), tabLayout.getTabCount());
viewPager.setAdapter(adapter);
viewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabLayout));
tabLayout.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
@Override
public void onTabSelected(TabLayout.Tab tab) {
viewPager.setCurrentItem(tab.getPosition());
}
@Override
public void onTabUnselected(TabLayout.Tab tab) {
}
@Override
public void onTabReselected(TabLayout.Tab tab) {
}
});
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.menu_main, menu);
return true;
}
@Override
public boolean onOptionsItemSelected(MenuItem item) {
int id = item.getItemId();
if (id == R.id.action_settings) {
return true;
}
return super.onOptionsItemSelected(item);
}
}
这是我的 XML 代码:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:background="@drawable/topbg"
android:minHeight="?attr/actionBarSize">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<ImageView
android:id="@+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:src="@drawable/top_logo" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="Hi, Marcos"
android:id="@+id/textView3"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:textSize="12dp" />
</RelativeLayout>
</android.support.v7.widget.Toolbar>
<Switch
android:id="@+id/mySwitch"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:showText="true"
android:textOn="ON"
android:thumb="@drawable/customswitchselector"
android:track="@drawable/custom_track"
android:textOff="OFF"
android:layout_marginTop="28dp"
android:textColor="#ffffff"
android:layout_marginLeft="50dp"
android:layout_marginStart="50dp"
android:layout_below="@+id/toolbar"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:id="@+id/textView4"
android:layout_marginRight="69dp"
android:layout_marginEnd="69dp"
android:textColor="#a6a6a6"
android:textSize="30dp"
android:layout_alignBottom="@+id/mySwitch"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true" />
<android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent">
</android.support.v4.view.ViewPager>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.TabLayout
android:id="@+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:elevation="6dp"
android:minHeight="?attr/actionBarSize"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginTop="149dp" />
<android.support.v4.view.ViewPager
android:id="@+id/pager1"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_below="@id/tab_layout"/>
</RelativeLayout>
</RelativeLayout>
使用 RelativeLayout
意味着您将其 child 视图 相对 定位。例如,您可以说您希望 TabLayout
出现在 Switch
下方。为了指示两个视图之间的关系,使用了这两个属性:android:layout_below
和 android:layout_toRightOf
。与他们一起,您说我希望此视图位于具有以下资源 ID 的视图的下方或右侧。在您的情况下,TabLayout
的布局应该是这样的:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="@+id/mySwitch">
<android.support.design.widget.TabLayout
android:id="@+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:elevation="6dp"
android:minHeight="?attr/actionBarSize"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginTop="149dp" />
<android.support.v4.view.ViewPager
android:id="@+id/pager1"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_below="@id/tab_layout"/>
</RelativeLayout>
请注意,您已经在 Switch
和 Toolbar
之间建立了相同的关系。
还有其他标签与 RelativeLayout 一起使用(使视图居中,或将其对齐到布局的边缘)。如果您不为 child 视图提供任何这些,默认情况下它将绘制在 RelativeLayout 的左上边缘。如果那里已经有一个视图,它们将只是在彼此之上。如果您不为任何 child 视图提供定位信息,则所有视图都将在左上边缘绘制,并且都可以重叠。有时这是我们正在寻找的行为,但不是您的情况。您没有在 xml 中为 Tab 部分的布局添加属性,Android 推断只是将其绘制在 Switch 的顶部。所以这个布局得到了 Switch
的触摸事件,这就是它不起作用的原因。
但是为什么让 Switch
最后一个 child 有效呢?因为视图是按照它们在 xml 中的顺序绘制的。所以当 Switch
最后一个时,它最后绘制,在 RelativeLayout child 之后,它是最上面的。这意味着它现在可以获取触摸事件。但是,您可以看到如何使用属性是更好的解决方案。它们实际上是为了解决像您这样的情况,使用 children 的顺序有点微妙。
我正在构建一个 Android 应用程序,在我的 MainActivity 上有一个 "switch" 按钮,在它的正下方有一个包含三个不同选项卡的栏。
开关按钮可以在"on"和"off"中设置。这是我尝试做的第一件事,而且效果很好。但是在我添加这个带有选项卡的栏之后,切换按钮停止工作,它似乎在这个栏内有一些东西不允许切换工作。我是 Android 开发新手。
这是我的 MainActivity 代码:
如果我删除或评论下面“//Tabs”中的所有内容,开关将再次开始工作,否则它不会从打开变为关闭。
public class MainScreen extends AppCompatActivity{
Switch list_toggle;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main_screen);
final TextView textView4 = (TextView) findViewById(R.id.textView4);
textView4.setText(Html.fromHtml("Absent"));
list_toggle = (Switch) findViewById(R.id.mySwitch);
list_toggle.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
if (isChecked) {
textView4.setText(Html.fromHtml("Available"));
} else {
textView4.setText(Html.fromHtml("Absent"));
}
}
});
//Tabs
TabLayout tabLayout = (TabLayout) findViewById(R.id.tab_layout);
tabLayout.addTab(tabLayout.newTab().setText("Orders"));
tabLayout.addTab(tabLayout.newTab().setText("Past Orders"));
tabLayout.addTab(tabLayout.newTab().setText("More"));
tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);
final ViewPager viewPager = (ViewPager) findViewById(R.id.pager);
final PagerAdapter adapter = new PagerAdapter
(getSupportFragmentManager(), tabLayout.getTabCount());
viewPager.setAdapter(adapter);
viewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabLayout));
tabLayout.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
@Override
public void onTabSelected(TabLayout.Tab tab) {
viewPager.setCurrentItem(tab.getPosition());
}
@Override
public void onTabUnselected(TabLayout.Tab tab) {
}
@Override
public void onTabReselected(TabLayout.Tab tab) {
}
});
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.menu_main, menu);
return true;
}
@Override
public boolean onOptionsItemSelected(MenuItem item) {
int id = item.getItemId();
if (id == R.id.action_settings) {
return true;
}
return super.onOptionsItemSelected(item);
}
}
这是我的 XML 代码:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:background="@drawable/topbg"
android:minHeight="?attr/actionBarSize">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<ImageView
android:id="@+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:src="@drawable/top_logo" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="Hi, Marcos"
android:id="@+id/textView3"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:textSize="12dp" />
</RelativeLayout>
</android.support.v7.widget.Toolbar>
<Switch
android:id="@+id/mySwitch"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:showText="true"
android:textOn="ON"
android:thumb="@drawable/customswitchselector"
android:track="@drawable/custom_track"
android:textOff="OFF"
android:layout_marginTop="28dp"
android:textColor="#ffffff"
android:layout_marginLeft="50dp"
android:layout_marginStart="50dp"
android:layout_below="@+id/toolbar"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:id="@+id/textView4"
android:layout_marginRight="69dp"
android:layout_marginEnd="69dp"
android:textColor="#a6a6a6"
android:textSize="30dp"
android:layout_alignBottom="@+id/mySwitch"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true" />
<android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent">
</android.support.v4.view.ViewPager>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.TabLayout
android:id="@+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:elevation="6dp"
android:minHeight="?attr/actionBarSize"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginTop="149dp" />
<android.support.v4.view.ViewPager
android:id="@+id/pager1"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_below="@id/tab_layout"/>
</RelativeLayout>
</RelativeLayout>
使用 RelativeLayout
意味着您将其 child 视图 相对 定位。例如,您可以说您希望 TabLayout
出现在 Switch
下方。为了指示两个视图之间的关系,使用了这两个属性:android:layout_below
和 android:layout_toRightOf
。与他们一起,您说我希望此视图位于具有以下资源 ID 的视图的下方或右侧。在您的情况下,TabLayout
的布局应该是这样的:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="@+id/mySwitch">
<android.support.design.widget.TabLayout
android:id="@+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:elevation="6dp"
android:minHeight="?attr/actionBarSize"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginTop="149dp" />
<android.support.v4.view.ViewPager
android:id="@+id/pager1"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_below="@id/tab_layout"/>
</RelativeLayout>
请注意,您已经在 Switch
和 Toolbar
之间建立了相同的关系。
还有其他标签与 RelativeLayout 一起使用(使视图居中,或将其对齐到布局的边缘)。如果您不为 child 视图提供任何这些,默认情况下它将绘制在 RelativeLayout 的左上边缘。如果那里已经有一个视图,它们将只是在彼此之上。如果您不为任何 child 视图提供定位信息,则所有视图都将在左上边缘绘制,并且都可以重叠。有时这是我们正在寻找的行为,但不是您的情况。您没有在 xml 中为 Tab 部分的布局添加属性,Android 推断只是将其绘制在 Switch 的顶部。所以这个布局得到了 Switch
的触摸事件,这就是它不起作用的原因。
但是为什么让 Switch
最后一个 child 有效呢?因为视图是按照它们在 xml 中的顺序绘制的。所以当 Switch
最后一个时,它最后绘制,在 RelativeLayout child 之后,它是最上面的。这意味着它现在可以获取触摸事件。但是,您可以看到如何使用属性是更好的解决方案。它们实际上是为了解决像您这样的情况,使用 children 的顺序有点微妙。