Footer on MergeAdapter by CommonsWare - commonsware-cwac

I'm using MergeAdapter by CommonsWare to merge two ListViews.
How can i add a fixed footer to this list?
I'm doing this way:
MergeAdapter adapter = new MergeAdapter();;
View msg=inflater.inflate(R.layout.inicio_msg,null);
((TextView)msg.findViewById(R.id.msg_text)).setText(tw.getText());
adapter.addView(msg, false);
View news=inflater.inflate(R.layout.inicio_news,null);
adapter.addView(news, true);
setListAdapter(adapter);
Where and how i put the fixed footer?

Then you would do it the same way as you would without MergeAdapter:
Wrap the ListView in a vertical LinearLayout
Put your footer in the LinearLayout, after the ListView

Related

Is it possible to dynamically add a slide to an existing Materialize Carousel?

I am able to create a carousel as described here. The carousel appears and works properly.
Later on I would like to add an additional slide:
$(".carousel").append('<a class="carousel-item active" href="#six!"><img src="http://lorempixel.com/250/250/nature/6"></a>');
However, this does not appear to work as the slide does not get added to the carousel.
Is adding slides to an initialized carousel not supported or is this an issue on my end?
Sure it is. I haven't seen any solution in the internet. I believe that there might be a better and smoother solution but this one is mine.
All you need to do is after adding your new items remove the initialized class from already initialized main carousel div and reinitialize it.
//init carousel
var slider = $('.carousel');
slider.carousel();
//add a new item
slider.append('<a class="carousel-item active" href="#three!"><img src="http://lorempixel.com/250/250/nature/3"></a>');
//remove the 'initialized' class which prevents slider from initializing itself again when it's not needed
if (slider.hasClass('initialized')){
slider.removeClass('initialized')
}
//just reinit the carousel
slider.carousel();
full working fiddle: https://jsfiddle.net/8tq4ycm3/
I had the same problem, but I'm using the slider. (http://materializecss.com/media.html#slider)
To resolve this, it was necessary to clear all items, re-add items with the new one, and then re-bind the slider.
Follow example: https://codepen.io/troits/pen/QvdZov
let itens = [];
function addItem(){
$('.slides').empty();
$('.slider > .indicators').detach();
itens.push(createItem());
for(i in itens){
$('.slides').append(itens[i]);
}
$('.slider').slider();
showItem(i);
}
function showItem(i){
$('.slider > .indicators > .indicator-item')[i].click();
}

Bootstrap sidebar - make fixed depending on scroll position

Please see my fiddle below:
https://jsfiddle.net/okiewardoyo/s23v891m/11/
.affix {
top: 0;
}
To make the screen wider, scroll your screen.
What I want is, if I scroll, the sidebar become fixed when scrolling reach the bottom of header.
Then, when I scroll and reach the footer, the sidebar is not fixed and it follows the footer.
You will need to add an offset to the content class, and remove it again using jQuery.
Add the id 'content' to your content div. Then add the following jQuery script:
$('.sidebar').on('affix.bs.affix', function() {
$('#content').addClass('col-sm-offset-3');
}).on('affix-top.bs.affix', function(){
$('#content').removeClass('col-sm-offset-3');
});
You can test this here: https://jsfiddle.net/TimOgilvy/s23v891m/16/
Note I added a clearfix to the header.

Re-render a VariableSizedWrapGrid

Once a VariableSizedWrapGrid has rendered its content, is there a way to refresh its layout so that it re-renders and re-applies the sizes if they have changed?
For example, the first item is twice the size of the rest, then I change the column and row span values in the view model. Now I want to invoke the grid to re-render.
Here's a simple way:
public void Update(GridView gridView)
{
if (!(gridView.ItemsPanelRoot is VariableSizedWrapGrid))
throw new ArgumentException("ItemsPanel is not VariableSizedWrapGrid");
foreach (var container in gridView.ItemsPanelRoot.Children.Cast<GridViewItem>())
{
var data = container.Content as Common.ModelBase;
VariableSizedWrapGrid.SetRowSpan(container, data.RowSpan);
VariableSizedWrapGrid.SetColumnSpan(container, data.ColSpan);
}
gridView.ItemsPanelRoot.InvalidateMeasure();
}
Assuming Windows.UI.Xaml.Controls.GridView as ItemsControl
Assuming Windows.UI.Xaml.Controls.VariableSizedWrapGrid as ItemPanel
I integrated it into the custom grid like this: http://codepaste.net/aopvks
Best of luck!

How to get css class from image tag on button tap Sencha Touch?

I’ve added an image tag in ListView in itemTpl as follows:
<img src='/maxtouch/images/close.png' alt='close' id='imgFavClose' class='close-favlist' />
Now I want to remove the css class 'close-favlist' from image on button tap event. To remove the css class I’ve written following line of code:
var favList = Ext.getCmp('favList'),
imgClose = favList.down('#imgFavClose');
imgClose.removeCls('close-favlist');
Here favList is id of ListView.
But it does not work. Plz let me know what correct way to perform this task.
Any help is appreciated!!
You can try this:
Ext.select('#imgFavClose').removeCls('close-favlist');
Check the docs on select

Titanium Appcelerator Custom Buttons

I'm new with Appcelerator and I encountered an annoying problem regarding layout.
I have to do a menu bar that is very easy to do with plain html (ul>li>a and that's all). The problem is that it seems that all button-related functions are not... customizable. I want buttons to be displayed as plain text, not buttons.
The first thought was to use labels (instead of buttons). But... Is this a right way? I need a menu bar, not a text paragraph! Besides that, the menu is somehow flexible, not like labels.
This is one (of many!) things i tried:
var menu_color = Titanium.UI.createButton({
title:Ti.Locale.getString("menu_color") || "Color",
height:24,
top:10
});
I also added borderWidth:0 (no effect) and backgroundColor:none/transparent with no luck.
Help? :)
I usually use views when I need to create what you described above.
For example:
I use a view with a vertical layout, then add my child views. The child views then have listeners for the click or whatever event.
This allows you to have more control over the formatting. A side effect of this is you will need to create your own "press" ui cue in some cases.
var demo = {win : Ti.UI.currentWindow};
(function(){
//Create the container view
demo.vwMain = Ti.UI.createView({height:100, layout:'vertical', backgroundColor:'yellow'});
demo.win.add(demo.vwMain);
demo.fakebutton1 = Ti.UI.createView({height:40, backgroundColor:'blue',left:25,right:25,borderRadius:5,borderColor:'#000'});
demo.vwMain.add(demo.fakebutton1);
demo.fakebutton2 = Ti.UI.createView({top:5,height:40, backgroundColor:'green',left:25,right:25,borderRadius:5,borderColor:'#000'});
demo.vwMain.add(demo.fakebutton2);
demo.fakebutton1.addEventListener('click', function(e) {
alert('Clicked fake button 1');
});
demo.fakebutton2.addEventListener('click', function(e) {
alert('Clicked fake button 2');
});
})();
create a view with layout property is set to vertical and add label or button which you want.View is like in HTML.Hope you understand.