我在Media Player
个应用中使用SlidingUpPanel
library。
在幻灯片中,我有媒体控件,我想在顶部显示曲目的艺术作品。我遇到的问题是我希望媒体控件始终位于屏幕的底部(即使用户拖动面板,这意味着我必须使用onPanelSlide ()
方法)。也许像一个视差效果(不确定这是否是正确的名称)。这就是我现在所拥有的:
正如您所看到的,当我拖动面板时,控件会粘在顶部。我希望它能粘在屏幕的底部,并在其上方展示艺术作品。
我在考虑CoordinatorLayout
,但我不知道它是如何运作的!
我的代码:
activity.xml
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.sothree.slidinguppanel.SlidingUpPanelLayout
android:id="@+id/sliding_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="bottom"
sothree:umanoPanelHeight="92dp"
sothree:umanoShadowHeight="4dp">
<ListView
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<include layout="@layout/details_slide_bar" />
</com.sothree.slidinguppanel.SlidingUpPanelLayout>
</RelativeLayout>
details_slide_bar.xml
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="bottom"
android:orientation="vertical">
<ImageView
android:id="@+id/ivArtworkBar"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:visibility="gone"/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="92dp"
android:orientation="horizontal"
android:id="@+id/lDetailsBar">
/!-- Content of the detalBar !-->
</RelativeLayout>
</LinearLayout>
目前,我只是检查面板的状态并相应地调整图稿的visibility
。
必须有另一种方式!
答案 0 :(得分:5)
首先,在onCreate of your activity
function checkLecturer() {
var lecturerFullname = $('#lecturerFullname').val();
var compVal = $('#supervisorID').val();
if(compVal.localeCompare(lecturerFullname) === 0) {
alert('same thing');
} else {
// do something
}
}
$(document).ready(function() {
// add the event listender
$('#lecturerFullname').on('change', checkLecturer);
})
然后将面板状态设置为已折叠。
mLayout = (SlidingUpPanelLayout) findViewById(R.id.sliding_layout);
如果您的滑动面板不可见,那么
mLayout.setPanelState(SlidingUpPanelLayout.PanelState.COLLAPSED);
mLayout.setEnableDragViewTouchEvents(false);
mLayout.setDragView(null);
mLayout.setEnabled(false);
mLayout.setClickable(false);
此处mLayout.setPanelHeight(your panel height);
值必须为整数。甚至你可以动态地像your panel height
;
答案 1 :(得分:3)
我明白了!大脑在最近几天没有工作,我想大声笑。这只是简单的数学!
private SlidingUpPanelLayout slidingLayout;
@Ovverride
public void onCreate(Bundle bundle) {
slidingLayout = (SlidingUpPanelLayout) findViewById(R.id.sliding_layout);
}
@Override
public void onPanelSlide(View panel, float slideOffset) {
if (lDetails != null) {
if (!varsInitialized) {
relativeParams = (RelativeLayout.LayoutParams) lDetails.getLayoutParams();
varsInitialized = true;
}
int adjustedMargin = slidingLayout.getHeight() - slidingLayout.getPanelHeight() - panel.getTop();
relativeParams.setMargins(0, adjustedMargin, 0, 0); // left, top, right, bottom
lDetails.setLayoutParams(relativeParams);
}
}
答案 2 :(得分:2)
嗯,这是非常具体的实施。也许你可以这样做
var derp = function(){
return newEl(head, 'div', someAttributes, someText);
};
function loop(num, content) {
for(var i = 0; i < num; i++) {
content(); // <== call function derp here
console.log('derp');
}
}
loop(3, derp);
答案 3 :(得分:2)
尝试将您的listview和details_slide_bar包装在RelativeLayout中,并更改onPanelExpanded和onPaanelCollapsed中的LayoutParams。以下是我使用该库的一些项目的示例。
<强> activity_main.xml中强>
<android.support.v4.widget.DrawerLayout
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:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.nerdability.android.ArticleListActivity">
<com.sothree.slidinguppanel.SlidingUpPanelLayout
xmlns:sothree="http://schemas.android.com/apk/res-auto"
android:id="@+id/sliding_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="bottom"
sothree:umanoPanelHeight="?attr/actionBarSize"
sothree:umanoShadowHeight="4dp"
sothree:umanoDragView="@+id/dragView">
<!-- MAIN CONTENT -->
<RelativeLayout
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"
android:layout_marginLeft="0dp"
android:divider="?android:attr/dividerHorizontal"
android:orientation="horizontal"
android:showDividers="middle">
<LinearLayout
android:id="@+id/toolbarContainer"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:minHeight="?attr/actionBarSize">
<include layout="@layout/toolbar"/>
</LinearLayout>
<LinearLayout
android:layout_below="@id/toolbarContainer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginLeft="0dp"
android:layout_marginStart="0dp"
android:divider="?android:attr/dividerHorizontal"
android:baselineAligned="false"
android:orientation="horizontal"
android:showDividers="middle"
tools:context=".ArticleListActivity" >
<FrameLayout
android:id="@+id/article_list"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"/>
</LinearLayout>
</RelativeLayout>
<!-- SLIDING LAYOUT -->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:clickable="false"
android:focusable="true"
android:id="@+id/dragView">
<ImageView
android:id="@+id/img"
android:layout_centerInParent="true"
android:layout_marginTop="25dp"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
<LinearLayout
android:id="@+id/toolbar_view"
android:layout_alignParentTop="true"
android:layout_width="match_parent"
android:background="@color/holo_blue_light"
android:layout_height="?attr/actionBarSize"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:ellipsize="end"
android:layout_gravity="center_vertical"
android:layout_height="wrap_content"
android:textSize="25sp"
android:textColor="@color/white"
android:paddingLeft="20dp"
android:text="@string/app_name"/>
</LinearLayout>
<include
android:id="@+id/player_view"
android:layout_alignParentTop="true"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
layout="@layout/player" />
</RelativeLayout>
</com.sothree.slidinguppanel.SlidingUpPanelLayout>
</android.support.v4.widget.DrawerLayout>
<强> MainActivity.Java 强>
mLayout = (SlidingUpPanelLayout) findViewById(R.id.sliding_layout);
mLayout.setPanelSlideListener(new SlidingUpPanelLayout.PanelSlideListener() {
View playerView = (View) findViewById(R.id.player_view);
View toolbarView = (View) findViewById(R.id.toolbar_view);
@Override
public void onPanelSlide(View panel, float slideOffset) {
Log.i(TAG, "onPanelSlide, offset " + slideOffset);
}
@Override
public void onPanelExpanded(View panel) {
Log.i(TAG, "onPanelExpanded");
RelativeLayout.LayoutParams lp = (RelativeLayout.LayoutParams) playerView.getLayoutParams();
lp.removeRule(RelativeLayout.ALIGN_PARENT_TOP);
lp.addRule(RelativeLayout.ALIGN_PARENT_BOTTOM, RelativeLayout.TRUE);
playerView.setLayoutParams(lp);
playerView.bringToFront();
}
@Override
public void onPanelCollapsed(View panel) {
Log.i(TAG, "onPanelCollapsed");
RelativeLayout.LayoutParams lp = (RelativeLayout.LayoutParams) playerView.getLayoutParams();
lp.removeRule(RelativeLayout.ALIGN_PARENT_BOTTOM);
lp.addRule(RelativeLayout.ALIGN_PARENT_TOP, RelativeLayout.TRUE);
playerView.setLayoutParams(lp);
playerView.bringToFront();
}
@Override
public void onPanelAnchored(View panel) {
Log.i(TAG, "onPanelAnchored");
}
@Override
public void onPanelHidden(View panel) {
Log.i(TAG, "onPanelHidden");
}
});
答案 4 :(得分:1)
我认为你应该尝试相对布局。 如果你有一个填充整个屏幕的相对布局,你应该能够使用android:layout_alignParentBottom将按钮移动到屏幕的底部。 首先在你的布局文件中,用android:layout_above。
定位上面其余的布局创建HEADER和FOOTER,这是一个例子
[布局XML]