gpt4 book ai didi

android - 选择textview时如何显示弹出窗口而不是CAB?

转载 作者:太空宇宙 更新时间:2023-11-03 12:03:35 27 4
gpt4 key购买 nike

我正在制作一个阅读应用程序,它有一个全屏活动。
当用户选择文本的一部分时,会出现一个带有copy选项的contextual action bar。这是默认行为。但是这个actionbar阻止了下面的文本,所以用户不能选择它。
我想显示一个弹出窗口如下。
enter image description here
我试图从false返回onCreateActionMode,但当我这样做时,我也无法选择文本。
我想知道是否有一个标准的方法来实现这一点,因为许多阅读应用程序使用这种设计。

最佳答案

我不知道play books是如何做到这一点的,但是你可以创建一个PopupWindow并根据选择的文本使用Layout.getSelectionPath和一点数学计算它的位置。基本上,我们要:
计算选定文本的边界
计算PopupWindow的边界和初始位置
计算两者之间的差
PopupWindow偏移到所选文本上方或下方的水平/垂直静止中心
计算选择界限
From the docs
用高光的表示填充指定的路径
在指定的偏移之间。这通常是一个矩形或
可能不连续的矩形集。如果开始和结束是
同样,返回的路径也是空的。
因此,在我们的例子中,指定的偏移是选择的开始和结束,可以使用Selection.getSelectionStartSelection.getSelectionEnd找到。为了方便起见,TextView为我们提供了TextView.getSelectionStartTextView.getSelectionEndTextView.getLayout

    final Path selDest = new Path();
final RectF selBounds = new RectF();
final Rect outBounds = new Rect();

// Calculate the selection start and end offset
final int selStart = yourTextView.getSelectionStart();
final int selEnd = yourTextView.getSelectionEnd();
final int min = Math.max(0, Math.min(selStart, selEnd));
final int max = Math.max(0, Math.max(selStart, selEnd));

// Calculate the selection outBounds
yourTextView.getLayout().getSelectionPath(min, max, selDest);
selDest.computeBounds(selBounds, true /* this param is ignored */);
selBounds.roundOut(outBounds);

现在我们有了一个 Rect的选定文本边界,我们可以选择相对于它放置 PopupWindow的位置。在这种情况下,我们将沿选定文本的顶部或底部水平居中,这取决于显示弹出窗口所需的空间。
计算初始弹出坐标
接下来我们需要计算弹出内容的边界。为此,我们首先需要调用 PopupWindow.showAtLocation,但我们充气的 View的界限不会立即可用,因此我建议使用 ViewTreeObserver.OnGlobalLayoutListener来等待它们可用。
popupWindow.showAtLocation(yourTextView, Gravity.TOP, 0, 0)

PopupWindow.showAtLocation需要:
a View从中检索一个有效的 Window token,它只是唯一地标识要放置弹出窗口的 Window
一个可选的重力,但在我们的例子中它将 Gravity.TOP
可选的X/Y偏移
因为在弹出内容布局之前,我们无法确定x/y偏移量,所以我们将最初将其放置在默认位置。如果您试图在传入的 PopupWindow.showAtLocation设置好之前调用 View,您将收到一个 WindowManager.BadTokenException,因此您可以考虑使用 ViewTreeObserver.OnGlobalLayoutListener来避免这一情况,但它主要出现在您选择了文本并旋转设备时。
    final Rect cframe = new Rect();
final int[] cloc = new int[2];
popupContent.getLocationOnScreen(cloc);
popupContent.getLocalVisibleRect(cbounds);
popupContent.getWindowVisibleDisplayFrame(cframe);

final int scrollY = ((View) yourTextView.getParent()).getScrollY();
final int[] tloc = new int[2];
yourTextView.getLocationInWindow(tloc);

final int startX = cloc[0] + cbounds.centerX();
final int startY = cloc[1] + cbounds.centerY() - (tloc[1] - cframe.top) - scrollY;

View.getLocationOnScreen将返回弹出内容的x/y坐标。
View.getLocalVisibleRect将返回弹出内容的边界
View.getWindowVisibleDisplayFrame将返回偏移量以适应操作栏(如果存在)
View.getScrollY将返回我们的 y所在的滚动容器的 TextView偏移量(在我的例子中是 ScrollView
View.getLocationInWindow将返回我们 yTextView偏移量,以防操作栏将其向下推一点
一旦我们得到了所需的所有信息,我们就可以计算弹出内容的最终起始x/y,然后用这个来计算它们与所选文本之间的差异 Rect,这样我们就可以 PopupWindow.update到新的位置。
计算偏移弹出坐标
    // Calculate the top and bottom offset of the popup relative to the selection bounds
final int popupHeight = cbounds.height();
final int textPadding = yourTextView.getPaddingLeft();
final int topOffset = Math.round(selBounds.top - startY);
final int btmOffset = Math.round(selBounds.bottom - (startY - popupHeight));

// Calculate the x/y coordinates for the popup relative to the selection bounds
final int x = Math.round(selBounds.centerX() + textPadding - startX);
final int y = Math.round(selBounds.top - scrollY < startY ? btmOffset : topOffset);

如果有足够的空间在所选文本上方显示弹出窗口,我们会将其放在那里;否则,我们会将其偏移到所选文本下方。在我的例子中,我的 16dp周围有 TextView填充,所以这也需要考虑。我们将以最后的 xy位置结束,用它来抵消 PopupWindow
    popupWindow.update(x, y, -1, -1);

-1这里只表示我们为 PopupWindow提供的默认宽度/高度,在我们的情况下,它将 ViewGroup.LayoutParams.WRAP_CONTENT
监听选择更改
我们希望每次更改选定文本时都更新 PopupWindow
监听选择更改的一个简单方法是对 TextView进行子类划分,并提供对 TextView.onSelectionChanged的回调。
public class NotifyingSelectionTextView extends AppCompatTextView {

private SelectionChangeListener listener;

public NotifyingSelectionTextView(Context context, @Nullable AttributeSet attrs) {
super(context, attrs);
}

@Override
protected void onSelectionChanged(int selStart, int selEnd) {
super.onSelectionChanged(selStart, selEnd);
if (listener != null) {
if (hasSelection()) {
listener.onTextSelected();
} else {
listener.onTextUnselected();
}
}
}

public void setSelectionChangeListener(SelectionChangeListener listener) {
this.listener = listener;
}

public interface SelectionChangeListener {
void onTextSelected();
void onTextUnselected();
}

}

监听滚动变化
如果您在类似于 TextView的滚动容器中有一个 ScrollView,您可能还需要监听滚动更改,以便在滚动时锚定弹出窗口。监听这些消息的一个简单方法是对 ScrollView进行子类划分,并提供对 View.onScrollChanged的回调。
public class NotifyingScrollView extends ScrollView {

private ScrollChangeListener listener;

public NotifyingScrollView(Context context, @Nullable AttributeSet attrs) {
super(context, attrs);
}

@Override
protected void onScrollChanged(int l, int t, int oldl, int oldt) {
super.onScrollChanged(l, t, oldl, oldt);
if (listener != null) {
listener.onScrollChanged();
}
}

public void setScrollChangeListener(ScrollChangeListener listener) {
this.listener = listener;
}

public interface ScrollChangeListener {
void onScrollChanged();
}

}

创建空 ActionMode.Callback
正如您在文章中提到的,我们需要在 true中返回 ActionMode.Callback.onCreateActionMode,以便我们的文本保持可选。但我们还需要在 Menu.clear中调用 ActionMode.Callback.onPrepareActionMode,以便删除您在 ActionMode中为选定文本找到的所有项。
/** An {@link ActionMode.Callback} used to remove all action items from text selection */
static final class EmptyActionMode extends SimpleActionModeCallback {

@Override
public boolean onCreateActionMode(ActionMode mode, Menu menu) {
// Return true to ensure the text is still selectable
return true;
}

@Override
public boolean onPrepareActionMode(ActionMode mode, Menu menu) {
// Remove all action items to provide an actionmode-less selection
menu.clear();
return true;
}

}

现在我们可以使用 TextView.setCustomSelectionActionModeCallback来应用我们的自定义 ActionModeSimpleActionModeCallback是一个自定义类,它只为 ActionMode.Callback提供存根,类似于 ViewPager.SimpleOnPageChangeListener
public class SimpleActionModeCallback implements ActionMode.Callback {

@Override
public boolean onCreateActionMode(ActionMode mode, Menu menu) {
return false;
}

@Override
public boolean onPrepareActionMode(ActionMode mode, Menu menu) {
return false;
}

@Override
public boolean onActionItemClicked(ActionMode mode, MenuItem item) {
return false;
}

@Override
public void onDestroyActionMode(ActionMode mode) {

}

}

布局
这是我们使用的 Activity布局:
<your.package.name.NotifyingScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/notifying_scroll_view"
android:layout_width="match_parent"
android:layout_height="match_parent">

<your.package.name.NotifyingSelectionTextView
android:id="@+id/notifying_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="16dp"
android:textIsSelectable="true"
android:textSize="20sp" />

</your.package.name.NotifyingScrollView>

这是我们的弹出式布局:
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/action_mode_popup_bg"
android:orientation="vertical"
tools:ignore="ContentDescription">

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">

<ImageButton
android:id="@+id/view_action_mode_popup_add_note"
style="@style/ActionModePopupButton"
android:src="@drawable/ic_note_add_black_24dp" />

<ImageButton
android:id="@+id/view_action_mode_popup_translate"
style="@style/ActionModePopupButton"
android:src="@drawable/ic_translate_black_24dp" />

<ImageButton
android:id="@+id/view_action_mode_popup_search"
style="@style/ActionModePopupButton"
android:src="@drawable/ic_search_black_24dp" />

</LinearLayout>

<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_margin="8dp"
android:background="@android:color/darker_gray" />

<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">

<ImageButton
android:id="@+id/view_action_mode_popup_red"
style="@style/ActionModePopupSwatch"
android:src="@drawable/round_red" />

<ImageButton
android:id="@+id/view_action_mode_popup_yellow"
style="@style/ActionModePopupSwatch"
android:src="@drawable/round_yellow" />

<ImageButton
android:id="@+id/view_action_mode_popup_green"
style="@style/ActionModePopupSwatch"
android:src="@drawable/round_green" />

<ImageButton
android:id="@+id/view_action_mode_popup_blue"
style="@style/ActionModePopupSwatch"
android:src="@drawable/round_blue" />

<ImageButton
android:id="@+id/view_action_mode_popup_clear_format"
style="@style/ActionModePopupSwatch"
android:src="@drawable/ic_format_clear_black_24dp"
android:visibility="gone" />

</LinearLayout>

</LinearLayout>

以下是我们的弹出式按钮样式:
<style name="ActionModePopupButton">
<item name="android:layout_width">48dp</item>
<item name="android:layout_height">48dp</item>
<item name="android:layout_weight">1</item>
<item name="android:background">?selectableItemBackground</item>
</style>

<style name="ActionModePopupSwatch" parent="ActionModePopupButton">
<item name="android:padding">12dp</item>
</style>

乌蒂尔
您将看到的 ViewUtils.onGlobalLayout只是一个处理一些 ViewTreeObserver.OnGlobalLayoutListener样板文件的实用方法。
public static void onGlobalLayout(final View view, final Runnable runnable) {
final OnGlobalLayoutListener listener = new OnGlobalLayoutListener() {

@Override
public void onGlobalLayout() {
view.getViewTreeObserver().removeOnGlobalLayoutListener(this);
runnable.run();
}

};
view.getViewTreeObserver().addOnGlobalLayoutListener(listener);
}

一起带来
所以,现在我们已经:
计算选定的文本边界
计算弹出边界
计算差异并确定弹出窗口偏移
提供了一种监听滚动更改和选择更改的方法
创建了我们的 Activity和弹出式布局
把所有的东西放在一起可能看起来像:
public class ActionModePopupActivity extends AppCompatActivity
implements ScrollChangeListener, SelectionChangeListener {

private static final int DEFAULT_WIDTH = -1;
private static final int DEFAULT_HEIGHT = -1;

private final Point currLoc = new Point();
private final Point startLoc = new Point();

private final Rect cbounds = new Rect();
private final PopupWindow popupWindow = new PopupWindow();
private final ActionMode.Callback emptyActionMode = new EmptyActionMode();

private NotifyingSelectionTextView yourTextView;

@SuppressLint("InflateParams")
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_action_mode_popup);

// Initialize the popup content, only add it to the Window once we've selected text
final LayoutInflater inflater = LayoutInflater.from(this);
popupWindow.setContentView(inflater.inflate(R.layout.view_action_mode_popup, null));
popupWindow.setWidth(WRAP_CONTENT);
popupWindow.setHeight(WRAP_CONTENT);

// Initialize to the NotifyingScrollView to observe scroll changes
final NotifyingScrollView scroll
= (NotifyingScrollView) findViewById(R.id.notifying_scroll_view);
scroll.setScrollChangeListener(this);

// Initialize the TextView to observe selection changes and provide an empty ActionMode
yourTextView = (NotifyingSelectionTextView) findViewById(R.id.notifying_text_view);
yourTextView.setText(IPSUM);
yourTextView.setSelectionChangeListener(this);
yourTextView.setCustomSelectionActionModeCallback(emptyActionMode);
}

@Override
public void onScrollChanged() {
// Anchor the popup while the user scrolls
if (popupWindow.isShowing()) {
final Point ploc = calculatePopupLocation();
popupWindow.update(ploc.x, ploc.y, DEFAULT_WIDTH, DEFAULT_HEIGHT);
}
}

@Override
public void onTextSelected() {
final View popupContent = popupWindow.getContentView();
if (popupWindow.isShowing()) {
// Calculate the updated x/y pop coordinates
final Point ploc = calculatePopupLocation();
popupWindow.update(ploc.x, ploc.y, DEFAULT_WIDTH, DEFAULT_HEIGHT);
} else {
// Add the popup to the Window and position it relative to the selected text bounds
ViewUtils.onGlobalLayout(yourTextView, () -> {
popupWindow.showAtLocation(yourTextView, TOP, 0, 0);
// Wait for the popup content to be laid out
ViewUtils.onGlobalLayout(popupContent, () -> {
final Rect cframe = new Rect();
final int[] cloc = new int[2];
popupContent.getLocationOnScreen(cloc);
popupContent.getLocalVisibleRect(cbounds);
popupContent.getWindowVisibleDisplayFrame(cframe);

final int scrollY = ((View) yourTextView.getParent()).getScrollY();
final int[] tloc = new int[2];
yourTextView.getLocationInWindow(tloc);

final int startX = cloc[0] + cbounds.centerX();
final int startY = cloc[1] + cbounds.centerY() - (tloc[1] - cframe.top) - scrollY;
startLoc.set(startX, startY);

final Point ploc = calculatePopupLocation();
popupWindow.update(ploc.x, ploc.y, DEFAULT_WIDTH, DEFAULT_HEIGHT);
});
});
}
}

@Override
public void onTextUnselected() {
popupWindow.dismiss();
}

/** Used to calculate where we should position the {@link PopupWindow} */
private Point calculatePopupLocation() {
final ScrollView parent = (ScrollView) yourTextView.getParent();

// Calculate the selection start and end offset
final int selStart = yourTextView.getSelectionStart();
final int selEnd = yourTextView.getSelectionEnd();
final int min = Math.max(0, Math.min(selStart, selEnd));
final int max = Math.max(0, Math.max(selStart, selEnd));

// Calculate the selection bounds
final RectF selBounds = new RectF();
final Path selection = new Path();
yourTextView.getLayout().getSelectionPath(min, max, selection);
selection.computeBounds(selBounds, true /* this param is ignored */);

// Retrieve the center x/y of the popup content
final int cx = startLoc.x;
final int cy = startLoc.y;

// Calculate the top and bottom offset of the popup relative to the selection bounds
final int popupHeight = cbounds.height();
final int textPadding = yourTextView.getPaddingLeft();
final int topOffset = Math.round(selBounds.top - cy);
final int btmOffset = Math.round(selBounds.bottom - (cy - popupHeight));

// Calculate the x/y coordinates for the popup relative to the selection bounds
final int scrollY = parent.getScrollY();
final int x = Math.round(selBounds.centerX() + textPadding - cx);
final int y = Math.round(selBounds.top - scrollY < cy ? btmOffset : topOffset);
currLoc.set(x, y - scrollY);
return currLoc;
}

/** An {@link ActionMode.Callback} used to remove all action items from text selection */
static final class EmptyActionMode extends SimpleActionModeCallback {

@Override
public boolean onCreateActionMode(ActionMode mode, Menu menu) {
// Return true to ensure the yourTextView is still selectable
return true;
}

@Override
public boolean onPrepareActionMode(ActionMode mode, Menu menu) {
// Remove all action items to provide an actionmode-less selection
menu.clear();
return true;
}

}

}

结果
With the action bar (link to video)
with action bar - no animation
Without the action bar (link to video)
without action bar - no animation
奖励-动画
因为我们知道 PopupWindow的起始位置和偏移位置随着选择的变化而变化,所以当我们移动对象时,可以很容易地在两个值之间执行线性插值来创建一个良好的动画。
public static float lerp(float a, float b, float v) {
return a + (b - a) * v;
}

private static final int DEFAULT_ANIM_DUR = 350;
private static final int DEFAULT_ANIM_DELAY = 500;

@Override
public void onTextSelected() {
final View popupContent = popupWindow.getContentView();
if (popupWindow.isShowing()) {
// Calculate the updated x/y pop coordinates
popupContent.getHandler().removeCallbacksAndMessages(null);
popupContent.postDelayed(() -> {
// The current x/y location of the popup
final int currx = currLoc.x;
final int curry = currLoc.y;
// Calculate the updated x/y pop coordinates
final Point ploc = calculatePopupLocation();
currLoc.set(ploc.x, ploc.y);
// Linear interpolate between the current and updated popup coordinates
final ValueAnimator anim = ValueAnimator.ofFloat(0f, 1f);
anim.addUpdateListener(animation -> {
final float v = (float) animation.getAnimatedValue();
final int x = Math.round(AnimUtils.lerp(currx, ploc.x, v));
final int y = Math.round(AnimUtils.lerp(curry, ploc.y, v));
popupWindow.update(x, y, DEFAULT_WIDTH, DEFAULT_HEIGHT);
});
anim.setDuration(DEFAULT_ANIM_DUR);
anim.start();
}, DEFAULT_ANIM_DELAY);
} else {
...
}
}

结果
With the action bar - animation (link to video)
with action bar - animation
额外的
我不讨论如何将单击侦听器附加到弹出操作,可能有几种方法可以通过不同的计算和实现来实现相同的效果。但我要说的是,如果你想检索选定的文本,然后对其进行处理, you'd just need to CharSequence.subSequence the min and max from the selected text
不管怎样,我希望这对你有帮助!如果你有任何问题,请告诉我。

关于android - 选择textview时如何显示弹出窗口而不是CAB?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43689020/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com