文章/答案/技术大牛

发布

社区首页 >问答首页 >如何在约束布局中实现滚动和缩放

问如何在约束布局中实现滚动和缩放
EN

Stack Overflow用户

提问于 2017-11-15 02:32:15

回答 1查看 694关注 0票数 3

现在我有了这样的布局。正如您所看到的，ui中有三件事

放大控制
重叠文本
活动元件

现在，我已经成功地实现了整个约束布局和缩放、退出控制的可移动特性。但是，我想滚动视图，因为文本是重叠的。滚动事件似乎与我的自定义可缩放事件冲突。我想实现滚动事件来向下滚动重叠的文本，但是不知道如何做到这一点.

感谢你的任何建议或评论。

layout.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:app="http://schemas.android.com/apk/res-auto"
  xmlns:tools="http://schemas.android.com/tools"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  tools:context="com.mycompany.newmobileclient.ui.plant_inventory.PlantInventoryActivity">
  <ZoomControls
    android:id="@+id/simpleZoomControl"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginBottom="8dp"
    android:layout_marginEnd="8dp"
    android:layout_centerHorizontal="true"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent" />
  <android.support.constraint.ConstraintLayout
    android:id="@+id/plantInventory_container"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:layout_marginTop="8dp"
    android:layout_marginBottom="8dp"
    android:background="@color/worklist_divider_bg"
    app:layout_constraintBottom_toTopOf="@+id/simpleZoomControl"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.0"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/plantInventory_content_title">
    <TextView
      android:id="@+id/textView133"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"

      android:layout_marginTop="8dp"
      android:text="@string/sample_plantinventory2"
      app:layout_constraintStart_toStartOf="parent"
      app:layout_constraintTop_toTopOf="parent" />

  </android.support.constraint.ConstraintLayout>
  <TextView
    android:id="@+id/plantInventory_content_title"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:text="TextView"
    tools:text="Plant Inv Activity1 &amp; Activity2"
    android:padding="4dp"
    style="@style/worklist_label"
    android:background="@color/worklist_divider_bg"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

</android.support.constraint.ConstraintLayout>

strings.xml

<string name="sample_plantinventory2">
        Compatible Product List\n
Code     Description\n
-----    -----------\n
1234  MyCompany ABC1234 HKU (4GE)+ Dickson ABC123 DSL Wi-Fi\n
1234  MyCompany ABC1234 HKU (4GE)+ Dickson ABC123 DSL Wi-Fi\n
1234  MyCompany ABC1234 HKU (4GE)+ Dickson ABC123 DSL Wi-Fi\n
1234  MyCompany ABC1234 HKU (4GE)+ Dickson ABC123 DSL Wi-Fi\n
1234  MyCompany ABC1234 HKU (4GE)+ Dickson ABC123 DSL Wi-Fi\n
1234  MyCompany ABC1234 HKU (4GE)+ Dickson ABC123 DSL Wi-Fi\n
1234  MyCompany ABC1234 HKU (4GE)+ Dickson ABC123 DSL Wi-Fi\n
1234  MyCompany ABC1234 HKU (4GE)+ Dickson ABC123 DSL Wi-Fi\n
1234  MyCompany ABC1234 HKU (4GE)+ Dickson ABC123 DSL Wi-Fi\n
1234  MyCompany ABC1234 HKU (4GE)+ Dickson ABC123 DSL Wi-Fi\n
1234  MyCompany ABC1234 HKU (4GE)+ Dickson ABC123 DSL Wi-Fi\n
1234  MyCompany ABC1234 HKU (4GE)+ Dickson ABC123 DSL Wi-Fi\n
1234  MyCompany ABC1234 HKU (4GE)+ Dickson ABC123 DSL Wi-Fi\n
1234  MyCompany ABC1234 HKU (4GE)+ Dickson ABC123 DSL Wi-Fi\n
1234  MyCompany ABC1234 HKU (4GE)+ Dickson ABC123 DSL Wi-Fi\n
1234  MyCompany ABC1234 HKU (4GE)+ Dickson ABC123 DSL Wi-Fi\n
1234  MyCompany ABC1234 HKU (4GE)+ Dickson ABC123 DSL Wi-Fi\n
1234  MyCompany ABC1234 HKU (4GE)+ Dickson ABC123 DSL Wi-Fi\n
1234  MyCompany ABC1234 HKU (4GE)+ Dickson ABC123 DSL Wi-Fi\n
1234  MyCompany ABC1234 HKU (4GE)+ Dickson ABC123 DSL Wi-Fi\n
1234  MyCompany ABC1234 HKU (4GE)+ Dickson ABC123 DSL Wi-Fi\n
1234  MyCompany ABC1234 HKU (4GE)+ Dickson ABC123 DSL Wi-Fi\n
1234  MyCompany ABC1234 HKU (4GE)+ Dickson ABC123 DSL Wi-Fi\n
1234  MyCompany ABC1234 HKU (4GE)+ Dickson ABC123 DSL Wi-Fi\n
1234  MyCompany ABC1234 HKU (4GE)+ Dickson ABC123 DSL Wi-Fi\n
1234  MyCompany ABC1234 HKU (4GE)+ Dickson ABC123 DSL Wi-Fi\n
1234  MyCompany ABC1234 HKU (4GE)+ Dickson ABC123 DSL Wi-Fi\n
1234  MyCompany ABC1234 HKU (4GE)+ Dickson ABC123 DSL Wi-Fi\n
1234  MyCompany ABC1234 HKU (4GE)+ Dickson ABC123 DSL Wi-Fi\n
1234  MyCompany ABC1234 HKU (4GE)+ Dickson ABC123 DSL Wi-Fi\n
  </string>

PlantInventoryActivity.java

public class PlantInventoryActivity extends BaseActivity {

  private final float SCALE_RATIO = 0.25f;
  private final float MAX_SCALE_RATIO = 2f;
  private final float MIN_SCALE_RATIO = 1f;
  private ConstraintLayout plantInventoryContainer;
  private TextView plantInventory_content_title;

  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_plant_inventory);
    plantInventory_content_title = findViewById(R.id.plantInventory_content_title);
    plantInventoryContainer = findViewById(R.id.plantInventory_container);
    ZoomControls zoomControls = findViewById(R.id.simpleZoomControl);
    zoomControls.setOnZoomInClickListener(v -> {
      if (plantInventoryContainer.getScaleX() < MAX_SCALE_RATIO) {
        plantInventoryContainer.setScaleX(plantInventoryContainer.getScaleX() + SCALE_RATIO);
        plantInventoryContainer.setScaleY(plantInventoryContainer.getScaleY() + SCALE_RATIO);
      }
    });
    zoomControls.setOnZoomOutClickListener(v -> {
      if (plantInventoryContainer.getScaleX() > MIN_SCALE_RATIO) {
        plantInventoryContainer.setScaleX(plantInventoryContainer.getScaleX() - SCALE_RATIO);
        plantInventoryContainer.setScaleY(plantInventoryContainer.getScaleY() - SCALE_RATIO);
      }
    });
    zoomControls.bringToFront();
    plantInventory_content_title.bringToFront();
    plantInventoryContainer.setOnTouchListener(new ZoomableListener());


  }
}

ZoomableListener.java

public class ZoomableListener implements OnTouchListener {
  float x = 0;
  float y = 0;
  float dx = 0;
  float dy = 0;

  @Override
  public boolean onTouch(View myView, MotionEvent event) {
    switch (event.getAction()) {
      case MotionEvent.ACTION_DOWN: {
        x = event.getX();
        y = event.getY();
        dx = x - myView.getX();
        dy = y - myView.getY();
      }
      break;
      case MotionEvent.ACTION_MOVE: {
        myView.setX(event.getX() - dx);
        myView.setY(event.getY() - dy);
      }
      break;
      case MotionEvent.ACTION_UP: {
        //your stuff
      }
    }
    return true;
  }
}

java

android

xml

android-constraintlayout

回答 1

Stack Overflow用户

发布于 2017-11-21 01:51:35

经过几天的挣扎，我尝试使用水平和垂直滚动视图来实现滚动功能。并使用缩放控件控制文本大小(而不是文本缩放)。我知道这不像放大和可移动的功能，如pdf查看器。如果有更好的工作，我会更新它。

在嵌套约束布局编辑器中，可以像往常一样在设计编辑器中设计项。

activity.xml

<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:app="http://schemas.android.com/apk/res-auto"
  xmlns:tools="http://schemas.android.com/tools">
  <data>

    <variable
      name="viewModel"
      type="ActivityViewModel" />
    <variable
      name="selectedActivity"
      type="String" />

  </data>
  <android.support.constraint.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="MyActivity">
    <ZoomControls
      android:id="@+id/simpleZoomControl"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_marginBottom="8dp"
      android:layout_marginEnd="8dp"
      android:layout_marginRight="8dp"
      android:layout_centerHorizontal="true"
      app:layout_constraintBottom_toBottomOf="parent"
      app:layout_constraintEnd_toEndOf="parent" />
    <HorizontalScrollView
      android:id="@+id/scrollContainer"
      android:layout_width="0dp"
      android:layout_height="0dp"
      android:layout_marginTop="8dp"
      android:layout_marginBottom="8dp"
      android:fillViewport="true"
      app:layout_constraintBottom_toTopOf="@+id/simpleZoomControl"
      app:layout_constraintEnd_toEndOf="parent"
      app:layout_constraintHorizontal_bias="0.0"
      app:layout_constraintStart_toStartOf="parent"
      app:layout_constraintTop_toBottomOf="@+id/content_title">
      <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <LinearLayout
          android:id="@+id/directchild"
          android:layout_width="wrap_content"
          android:layout_height="fill_parent"
          android:orientation="horizontal">
          <include
            android:id="@+id/included"
            layout="@layout/inner_layout"
            app:viewModel="@{viewModel}" />
        </LinearLayout>
      </ScrollView>
    </HorizontalScrollView>
    <TextView
      android:id="@+id/content_title"
      style="@style/worklist_label"
      android:layout_width="0dp"
      android:layout_height="wrap_content"
      android:padding="4dp"
      android:background="@color/worklist_divider_bg"
      android:text="@{selectedActivity}"
      app:layout_constraintEnd_toEndOf="parent"
      app:layout_constraintStart_toStartOf="parent"
      app:layout_constraintTop_toTopOf="parent"
      tools:text=" Inv Activity1 &amp; Activity2" />

  </android.support.constraint.ConstraintLayout>
</layout>

Activity.java

@Override
  protected void onCreate(Bundle savedInstanceState) {
    ...
    ZoomControls zoomControls = binding.simpleZoomControl;
    zoomControls.setOnZoomInClickListener(v -> {
      increaseTextSize(SCALE_RATIO);
    });
    zoomControls.setOnZoomOutClickListener(v -> {
      decreaseTextSize(SCALE_RATIO);
    });
    zoomControls.bringToFront();
   }

@Override
  public void increaseTextSize(float value) {
    int childCount = binding.included.Container.getChildCount();
    for (int i = 0; i < childCount; i++) {
      View view = binding.included.Container.getChildAt(i);
      if (view instanceof TextView) {
        TextView textView = (TextView) view;
        float currentTextSize = textView.getTextSize();
        textView
            .setTextSize(TypedValue.COMPLEX_UNIT_PX, currentTextSize + value);
      }
    }
  }

  @Override
  public void decreaseTextSize(float value) {
    int childCount = binding.included.Container.getChildCount();
    for (int i = 0; i < childCount; i++) {
      View view = binding.included.Container.getChildAt(i);
      if (view instanceof TextView) {
        TextView textView = (TextView) view;
        float currentTextSize = textView.getTextSize();
        textView
            .setTextSize(TypedValue.COMPLEX_UNIT_PX, currentTextSize - value);
      }
    }
  }

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/47298440

复制

相似问题

问如何在约束布局中实现滚动和缩放
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在约束布局中实现滚动和缩放EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在约束布局中实现滚动和缩放
EN